From f2f775f20c1425e6de6fa0ff0fe78434434131de Mon Sep 17 00:00:00 2001 From: Brett Sun Date: Wed, 16 Dec 2015 17:49:30 +0100 Subject: [PATCH] Carry down currentUser as prop to MediaContainer instead of adding state --- js/components/ascribe_detail/edition.js | 87 ++++++++++--------- .../ascribe_detail/media_container.js | 37 +++----- js/components/ascribe_detail/piece.js | 18 ++-- .../ascribe_detail/piece_container.js | 62 ++++++------- .../ascribe_detail/prize_piece_container.js | 59 ++++++------- .../ascribe_detail/wallet_piece_container.js | 57 ++++++------ 6 files changed, 160 insertions(+), 160 deletions(-) diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js index 068b526c..6e3f4274 100644 --- a/js/components/ascribe_detail/edition.js +++ b/js/components/ascribe_detail/edition.js @@ -1,7 +1,7 @@ 'use strict'; import React from 'react'; -import { Link, History } from 'react-router'; +import { Link } from 'react-router'; import Moment from 'moment'; import Row from 'react-bootstrap/lib/Row'; @@ -44,8 +44,6 @@ let Edition = React.createClass({ loadEdition: React.PropTypes.func }, - mixins: [History], - getDefaultProps() { return { furtherDetailsType: FurtherDetails @@ -53,98 +51,103 @@ let Edition = React.createClass({ }, render() { - let FurtherDetailsType = this.props.furtherDetailsType; + const { + actionPanelButtonListType, + coaError, + currentUser, + edition, + furtherDetailsType: FurtherDetailsType, + loadEdition } = this.props; return ( + content={edition} + currentUser={currentUser} />
-

{this.props.edition.title}

- - +

{edition.title}

+ +
+ actionPanelButtonListType={actionPanelButtonListType} + edition={edition} + currentUser={currentUser} + handleSuccess={loadEdition}/> + show={edition.acl.acl_coa === true}> + coa={edition.coa} + coaError={coaError} + editionId={edition.bitcoin_id}/> 0}> + show={edition.ownership_history && edition.ownership_history.length > 0}> + history={edition.ownership_history} /> 0}> + show={edition.consign_history && edition.consign_history.length > 0}> + history={edition.consign_history} /> 0}> + show={edition.loan_history && edition.loan_history.length > 0}> + history={edition.loan_history} /> + show={!!(currentUser.username || edition.acl.acl_edit || edition.public_note)}> {return {'bitcoin_id': this.props.edition.bitcoin_id}; }} + id={() => {return {'bitcoin_id': edition.bitcoin_id}; }} label={getLangText('Personal note (private)')} - defaultValue={this.props.edition.private_note ? this.props.edition.private_note : null} + defaultValue={edition.private_note ? edition.private_note : null} placeholder={getLangText('Enter your comments ...')} editable={true} successMessage={getLangText('Private note saved')} url={ApiUrls.note_private_edition} - currentUser={this.props.currentUser}/> + currentUser={currentUser}/> {return {'bitcoin_id': this.props.edition.bitcoin_id}; }} + id={() => {return {'bitcoin_id': edition.bitcoin_id}; }} label={getLangText('Personal note (public)')} - defaultValue={this.props.edition.public_note ? this.props.edition.public_note : null} + defaultValue={edition.public_note ? edition.public_note : null} placeholder={getLangText('Enter your comments ...')} - editable={!!this.props.edition.acl.acl_edit} - show={!!this.props.edition.public_note || !!this.props.edition.acl.acl_edit} + editable={!!edition.acl.acl_edit} + show={!!edition.public_note || !!edition.acl.acl_edit} successMessage={getLangText('Public edition note saved')} url={ApiUrls.note_public_edition} - currentUser={this.props.currentUser}/> + currentUser={currentUser}/> 0 - || this.props.edition.other_data.length > 0}> + show={edition.acl.acl_edit || + Object.keys(edition.extra_data).length > 0 || + edition.other_data.length > 0}> + editable={edition.acl.acl_edit} + pieceId={edition.parent} + extraData={edition.extra_data} + otherData={edition.other_data} + handleSuccess={loadEdition} /> + edition={edition} /> diff --git a/js/components/ascribe_detail/media_container.js b/js/components/ascribe_detail/media_container.js index c6845a44..21151e60 100644 --- a/js/components/ascribe_detail/media_container.js +++ b/js/components/ascribe_detail/media_container.js @@ -14,10 +14,6 @@ import CollapsibleButton from './../ascribe_collapsible/collapsible_button'; import AclProxy from '../acl_proxy'; -import UserActions from '../../actions/user_actions'; -import UserStore from '../../stores/user_store'; - -import { mergeOptions } from '../../utils/general_utils.js'; import { getLangText } from '../../utils/lang_utils.js'; const EMBED_IFRAME_HEIGHT = { @@ -28,25 +24,22 @@ const EMBED_IFRAME_HEIGHT = { let MediaContainer = React.createClass({ propTypes: { content: React.PropTypes.object, + currentUser: React.PropTypes.object, refreshObject: React.PropTypes.func }, getInitialState() { - return mergeOptions( - UserStore.getState(), - { - timerId: null - }); + return { + timerId: null + }; }, componentDidMount() { - UserStore.listen(this.onChange); - UserActions.fetchCurrentUser(); - if (!this.props.content.digital_work) { return; } - let isEncoding = this.props.content.digital_work.isEncoding; + + const isEncoding = this.props.content.digital_work.isEncoding; if (this.props.content.digital_work.mime === 'video' && typeof isEncoding === 'number' && isEncoding !== 100 && !this.state.timerId) { let timerId = window.setInterval(this.props.refreshObject, 10000); this.setState({timerId: timerId}); @@ -60,22 +53,16 @@ let MediaContainer = React.createClass({ }, componentWillUnmount() { - UserStore.unlisten(this.onChange); - window.clearInterval(this.state.timerId); }, - onChange(state) { - this.setState(state); - }, - render() { - const { content } = this.props; + const { content, currentUser } = this.props; // Pieces and editions are joined to the user by a foreign key in the database, so // the information in content will be updated if a user updates their username. // We also force uniqueness of usernames, so this check is safe to dtermine if the // content was registered by the current user. - const didUserRegisterContent = this.state.currentUser && (this.state.currentUser.username === content.user_registered); + const didUserRegisterContent = currentUser && (currentUser.username === content.user_registered); let thumbnail = content.thumbnail.thumbnail_sizes && content.thumbnail.thumbnail_sizes['600x600'] ? content.thumbnail.thumbnail_sizes['600x600'] : content.thumbnail.url_safe; @@ -125,8 +112,12 @@ let MediaContainer = React.createClass({ show={['video', 'audio', 'image'].indexOf(mimetype) === -1 || content.acl.acl_download} aclObject={content.acl} aclName="acl_download"> - {embed} diff --git a/js/components/ascribe_detail/piece.js b/js/components/ascribe_detail/piece.js index 7481d1fb..dcbd980d 100644 --- a/js/components/ascribe_detail/piece.js +++ b/js/components/ascribe_detail/piece.js @@ -16,10 +16,10 @@ import MediaContainer from './media_container'; let Piece = React.createClass({ propTypes: { piece: React.PropTypes.object, + currentUser: React.PropTypes.object, header: React.PropTypes.object, subheader: React.PropTypes.object, buttons: React.PropTypes.object, - loadPiece: React.PropTypes.func, children: React.PropTypes.oneOfType([ React.PropTypes.arrayOf(React.PropTypes.element), React.PropTypes.element @@ -32,20 +32,22 @@ let Piece = React.createClass({ }, render() { + const { buttons, children, currentUser, header, piece, subheader } = this.props; + return ( + content={piece} + currentUser={currentUser} + refreshObject={this.updateObject} /> - {this.props.header} - {this.props.subheader} - {this.props.buttons} - - {this.props.children} + {header} + {subheader} + {buttons} + {children} ); diff --git a/js/components/ascribe_detail/piece_container.js b/js/components/ascribe_detail/piece_container.js index 7dfc9570..04665024 100644 --- a/js/components/ascribe_detail/piece_container.js +++ b/js/components/ascribe_detail/piece_container.js @@ -247,76 +247,76 @@ let PieceContainer = React.createClass({ }, render() { - if (this.state.piece && this.state.piece.id) { - let FurtherDetailsType = this.props.furtherDetailsType; - setDocumentTitle([this.state.piece.artist_name, this.state.piece.title].join(', ')); + const { furtherDetailsType: FurtherDetailsType } = this.props; + const { currentUser, piece } = this.state; + + if (piece && piece.id) { + setDocumentTitle([piece.artist_name, piece.title].join(', ')); return (
-

{this.state.piece.title}

- - - {this.state.piece.num_editions > 0 ? : null} +

{piece.title}

+ + + {piece.num_editions > 0 ? : null}
} subheader={
- - - + + +
} buttons={this.getActions()}> {this.getCreateEditionsDialog()} 0}> + show={piece.loan_history && piece.loan_history.length > 0}> + history={piece.loan_history} /> + show={!!(currentUser.username || piece.acl.acl_edit || piece.public_note)}> + currentUser={currentUser}/> + currentUser={currentUser}/> 0 - || this.state.piece.other_data.length > 0} + show={piece.acl.acl_edit + || Object.keys(piece.extra_data).length > 0 + || piece.other_data.length > 0} defaultExpanded={true}> diff --git a/js/components/whitelabel/prize/simple_prize/components/ascribe_detail/prize_piece_container.js b/js/components/whitelabel/prize/simple_prize/components/ascribe_detail/prize_piece_container.js index 16849ed1..6e1ea3b0 100644 --- a/js/components/whitelabel/prize/simple_prize/components/ascribe_detail/prize_piece_container.js +++ b/js/components/whitelabel/prize/simple_prize/components/ascribe_detail/prize_piece_container.js @@ -107,20 +107,22 @@ let PieceContainer = React.createClass({ }, getActions() { - if (this.state.piece && - this.state.piece.notifications && - this.state.piece.notifications.length > 0) { + const { currentUser, piece } = this.state; + + if (piece && piece.notifications && piece.notifications.length > 0) { return ( ); + notifications={piece.notifications}/>); } }, render() { - if(this.state.piece && this.state.piece.id) { + const { currentUser, piece } = this.state; + + if (piece && piece.id) { /* This really needs a refactor! @@ -129,37 +131,32 @@ let PieceContainer = React.createClass({ */ // Only show the artist name if you are the participant or if you are a judge and the piece is shortlisted - let artistName = ((this.state.currentUser.is_jury && !this.state.currentUser.is_judge) || - (this.state.currentUser.is_judge && !this.state.piece.selected )) ? - null : this.state.piece.artist_name; + let artistName; + if ((currentUser.is_jury && !currentUser.is_judge) || (currentUser.is_judge && !piece.selected )) { + artistName =