From 194c554637227c43f14fb38cfb3777c0c0db3305 Mon Sep 17 00:00:00 2001 From: Brett Sun Date: Mon, 11 Jan 2016 16:56:24 +0100 Subject: [PATCH] Update Ikono routes for loading user and whitelabel settings in top level app --- .../ikonotv/ikonotv_contract_notifications.js | 99 +++++++++---------- .../ikonotv_detail/ikonotv_piece_container.js | 54 +++++----- .../components/ikonotv/ikonotv_landing.js | 35 ++----- .../components/ikonotv/ikonotv_piece_list.js | 22 ++--- .../ikonotv/ikonotv_register_piece.js | 43 +++----- 5 files changed, 112 insertions(+), 141 deletions(-) diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js index 7975c1f3..2bbe15e4 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_contract_notifications.js @@ -6,49 +6,42 @@ import { History } from 'react-router'; import Glyphicon from 'react-bootstrap/lib/Glyphicon'; import Button from 'react-bootstrap/lib/Button'; -import NotificationActions from '../../../../../actions/notification_actions'; -import NotificationStore from '../../../../../stores/notification_store'; - -import UserActions from '../../../../../actions/user_actions'; -import UserStore from '../../../../../stores/user_store'; - -import OwnershipFetcher from '../../../../../fetchers/ownership_fetcher'; - -import WhitelabelStore from '../../../../../stores/whitelabel_store'; -import WhitelabelActions from '../../../../../actions/whitelabel_actions'; - import GlobalNotificationModel from '../../../../../models/global_notification_model'; import GlobalNotificationActions from '../../../../../actions/global_notification_actions'; -import CopyrightAssociationForm from '../../../../ascribe_forms/form_copyright_association'; +import NotificationActions from '../../../../../actions/notification_actions'; +import NotificationStore from '../../../../../stores/notification_store'; +import OwnershipFetcher from '../../../../../fetchers/ownership_fetcher'; + +import CopyrightAssociationForm from '../../../../ascribe_forms/form_copyright_association'; import Property from '../../../../ascribe_forms/property'; import AppConstants from '../../../../../constants/application_constants'; import { getLangText } from '../../../../../utils/lang_utils'; import { setDocumentTitle } from '../../../../../utils/dom_utils'; -import { mergeOptions } from '../../../../../utils/general_utils'; let IkonotvContractNotifications = React.createClass({ + propTypes: { + // Provided from PrizeApp + currentUser: React.PropTypes.object, + whitelabel: React.PropTypes.object, + + // Provided from router + location: React.PropTypes.object + }, mixins: [History], getInitialState() { - return mergeOptions( - NotificationStore.getState(), - UserStore.getState(), - WhitelabelStore.getState() - ); + return NotificationStore.getState(); }, componentDidMount() { NotificationStore.listen(this.onChange); - UserStore.listen(this.onChange); - UserActions.fetchCurrentUser(); - WhitelabelStore.listen(this.onChange); - WhitelabelActions.fetchWhitelabel(); + if (this.state.contractAgreementListNotifications === null){ NotificationActions.fetchContractAgreementListNotifications(); } @@ -56,7 +49,6 @@ let IkonotvContractNotifications = React.createClass({ componentWillUnmount() { NotificationStore.unlisten(this.onChange); - WhitelabelStore.unlisten(this.onChange); }, onChange(state) { @@ -64,8 +56,9 @@ let IkonotvContractNotifications = React.createClass({ }, getContract(){ - let notifications = this.state.contractAgreementListNotifications[0]; - let blob = notifications.contract_agreement.contract.blob; + const notifications = this.state.contractAgreementListNotifications[0]; + const blob = notifications.contract_agreement.contract.blob; + if (blob.mime === 'pdf') { return (
@@ -76,22 +69,24 @@ let IkonotvContractNotifications = React.createClass({ pluginspage="http://www.adobe.com/products/acrobat/readstep2.html"/>
); + } else { + return ( +
+ + + + Download contract + + +
+ ); } - return ( -
- - - - Download contract - - -
- ); }, getAppendix() { - let notifications = this.state.contractAgreementListNotifications[0]; - let appendix = notifications.contract_agreement.appendix; + const notifications = this.state.contractAgreementListNotifications[0]; + const appendix = notifications.contract_agreement.appendix; + if (appendix && appendix.default) { return ( {appendix.default} ); + } else { + return null; } - return null; }, handleConfirm() { - let contractAgreement = this.state.contractAgreementListNotifications[0].contract_agreement; + const contractAgreement = this.state.contractAgreementListNotifications[0].contract_agreement; OwnershipFetcher .confirmContractAgreement(contractAgreement) .then(this.handleConfirmSuccess); }, handleConfirmSuccess() { - let notification = new GlobalNotificationModel(getLangText('You have accepted the conditions'), 'success', 5000); + const notification = new GlobalNotificationModel(getLangText('You have accepted the conditions'), 'success', 5000); GlobalNotificationActions.appendGlobalNotification(notification); // Flush contract notifications and refetch @@ -123,20 +119,21 @@ let IkonotvContractNotifications = React.createClass({ }, handleDeny() { - let contractAgreement = this.state.contractAgreementListNotifications[0].contract_agreement; + const contractAgreement = this.state.contractAgreementListNotifications[0].contract_agreement; OwnershipFetcher .denyContractAgreement(contractAgreement) .then(this.handleDenySuccess); }, handleDenySuccess() { - let notification = new GlobalNotificationModel(getLangText('You have denied the conditions'), 'success', 5000); + const notification = new GlobalNotificationModel(getLangText('You have denied the conditions'), 'success', 5000); GlobalNotificationActions.appendGlobalNotification(notification); + this.history.pushState(null, '/collection'); }, getCopyrightAssociationForm(){ - let currentUser = this.state.currentUser; + const { currentUser } = this.props; if (currentUser && currentUser.profile && !currentUser.profile.copyright_association) { return ( @@ -149,24 +146,26 @@ let IkonotvContractNotifications = React.createClass({ ); + } else { + return null; } - return null; }, render() { + const { whitelabel } = this.props; + const { contractAgreementListNotifications } = this.state; + setDocumentTitle(getLangText('Contacts notifications')); - if (this.state.contractAgreementListNotifications && - this.state.contractAgreementListNotifications.length > 0) { - - let notifications = this.state.contractAgreementListNotifications[0]; - let blob = notifications.contract_agreement.contract.blob; + if (contractAgreementListNotifications && contractAgreementListNotifications.length) { + const notifications = contractAgreementListNotifications[0]; + const blob = notifications.contract_agreement.contract.blob; return (
- +
{getLangText('Contract')}
diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_detail/ikonotv_piece_container.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_detail/ikonotv_piece_container.js index df58b7c7..68d5a3e7 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_detail/ikonotv_piece_container.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_detail/ikonotv_piece_container.js @@ -3,29 +3,27 @@ import React from 'react'; import { History } from 'react-router'; +import EditionListActions from '../../../../../../actions/edition_list_actions'; + +import GlobalNotificationModel from '../../../../../../models/global_notification_model'; +import GlobalNotificationActions from '../../../../../../actions/global_notification_actions'; + import PieceActions from '../../../../../../actions/piece_actions'; import PieceStore from '../../../../../../stores/piece_store'; -import UserStore from '../../../../../../stores/user_store'; - import PieceListStore from '../../../../../../stores/piece_list_store'; import PieceListActions from '../../../../../../actions/piece_list_actions'; -import EditionListActions from '../../../../../../actions/edition_list_actions'; - import IkonotvSubmitButton from '../ikonotv_buttons/ikonotv_submit_button'; -import CollapsibleParagraph from '../../../../../../components/ascribe_collapsible/collapsible_paragraph'; - import IkonotvArtistDetailsForm from '../ikonotv_forms/ikonotv_artist_details_form'; import IkonotvArtworkDetailsForm from '../ikonotv_forms/ikonotv_artwork_details_form'; import WalletPieceContainer from '../../ascribe_detail/wallet_piece_container'; -import AscribeSpinner from '../../../../../ascribe_spinner'; +import CollapsibleParagraph from '../../../../../../components/ascribe_collapsible/collapsible_paragraph'; -import GlobalNotificationModel from '../../../../../../models/global_notification_model'; -import GlobalNotificationActions from '../../../../../../actions/global_notification_actions'; +import AscribeSpinner from '../../../../../ascribe_spinner'; import { getLangText } from '../../../../../../utils/lang_utils'; import { setDocumentTitle } from '../../../../../../utils/dom_utils'; @@ -34,6 +32,12 @@ import { mergeOptions } from '../../../../../../utils/general_utils'; let IkonotvPieceContainer = React.createClass({ propTypes: { + // Provided from PrizeApp + currentUser: React.PropTypes.object, + whitelabel: React.PropTypes.object, + + // Provided from router + location: React.PropTypes.object, params: React.PropTypes.object }, @@ -42,14 +46,12 @@ let IkonotvPieceContainer = React.createClass({ getInitialState() { return mergeOptions( PieceStore.getState(), - UserStore.getState(), PieceListStore.getState() ); }, componentDidMount() { PieceStore.listen(this.onChange); - UserStore.listen(this.onChange); PieceListStore.listen(this.onChange); // Every time we enter the piece detail page, just reset the piece @@ -62,7 +64,7 @@ let IkonotvPieceContainer = React.createClass({ // We need this for when the user clicks on a notification while being in another piece view componentWillReceiveProps(nextProps) { - if(this.props.params.pieceId !== nextProps.params.pieceId) { + if (this.props.params.pieceId !== nextProps.params.pieceId) { PieceActions.updatePiece({}); PieceActions.fetchOne(nextProps.params.pieceId); } @@ -70,7 +72,6 @@ let IkonotvPieceContainer = React.createClass({ componentWillUnmount() { PieceStore.unlisten(this.onChange); - UserStore.unlisten(this.onChange); PieceListStore.listen(this.onChange); }, @@ -91,13 +92,16 @@ let IkonotvPieceContainer = React.createClass({ EditionListActions.closeAllEditionLists(); EditionListActions.clearAllEditionSelections(); - let notification = new GlobalNotificationModel(response.notification, 'success'); + const notification = new GlobalNotificationModel(response.notification, 'success'); GlobalNotificationActions.appendGlobalNotification(notification); this.history.pushState(null, '/collection'); }, render() { + const { currentUser } = this.props; + const { piece } = this.state; + let furtherDetails = ( ); - if(this.state.piece.extra_data && Object.keys(this.state.piece.extra_data).length > 0 && this.state.piece.acl) { + if (piece.extra_data && Object.keys(piece.extra_data).length > 0 && piece.acl) { furtherDetails = ( + disabled={!piece.acl.acl_edit} /> + disabled={!piece.acl.acl_edit} /> ); } - if(this.state.piece && this.state.piece.id) { - setDocumentTitle([this.state.piece.artist_name, this.state.piece.title].join(', ')); + if (piece && piece.id) { + setDocumentTitle([piece.artist_name, piece.title].join(', ')); + return ( {furtherDetails} ); - } - else { + } else { return (
diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_landing.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_landing.js index 0758d6a9..c960be12 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_landing.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_landing.js @@ -6,47 +6,32 @@ import Button from 'react-bootstrap/lib/Button'; import LinkContainer from 'react-router-bootstrap/lib/LinkContainer'; -import UserStore from '../../../../../stores/user_store'; -import UserActions from '../../../../../actions/user_actions'; - import { getLangText } from '../../../../../utils/lang_utils'; import { setDocumentTitle } from '../../../../../utils/dom_utils'; let IkonotvLanding = React.createClass({ propTypes: { + // Provided from PrizeApp + currentUser: React.PropTypes.object, + whitelabel: React.PropTypes.object, + + // Provided from router location: React.PropTypes.object }, - getInitialState() { - return UserStore.getState(); - }, - - componentDidMount() { - UserStore.listen(this.onChange); - UserActions.fetchCurrentUser(); - }, - - componentWillUnmount() { - UserStore.unlisten(this.onChange); - }, - - onChange(state) { - this.setState(state); - }, - getEnterButton() { + const { currentUser, location } = this.props; let redirect = '/login'; - if(this.state.currentUser && this.state.currentUser.email) { + if (currentUser && currentUser.email) { redirect = '/collection'; - } - else if (this.props.location.query && this.props.location.query.redirect) { - redirect = '/' + this.props.location.query.redirect; + } else if (location.query.redirect) { + redirect = '/' + location.query.redirect; } return ( - + diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_piece_list.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_piece_list.js index 5b489d09..4661cc32 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_piece_list.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_piece_list.js @@ -4,44 +4,38 @@ import React from 'react'; import PieceList from '../../../../piece_list'; -import UserActions from '../../../../../actions/user_actions'; -import UserStore from '../../../../../stores/user_store'; import NotificationStore from '../../../../../stores/notification_store'; import IkonotvAccordionListItem from './ikonotv_accordion_list/ikonotv_accordion_list_item'; import { setDocumentTitle } from '../../../../../utils/dom_utils'; -import { mergeOptions } from '../../../../../utils/general_utils'; import { getLangText } from '../../../../../utils/lang_utils'; let IkonotvPieceList = React.createClass({ propTypes: { + // Provided from PrizeApp + currentUser: React.PropTypes.object, + whitelabel: React.PropTypes.object, + + // Provided from router location: React.PropTypes.object }, getInitialState() { - return mergeOptions( - NotificationStore.getState(), - UserStore.getState() - ); + return NotificationStore.getState(); }, componentDidMount() { NotificationStore.listen(this.onChange); - UserStore.listen(this.onChange); - - UserActions.fetchCurrentUser(); }, componentWillUnmount() { NotificationStore.unlisten(this.onChange); - UserStore.unlisten(this.onChange); }, onChange(state) { this.setState(state); - }, redirectIfNoContractNotifications() { @@ -56,6 +50,7 @@ let IkonotvPieceList = React.createClass({ return (
+ }]} />
); } diff --git a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js index c40d779d..d72080a7 100644 --- a/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js +++ b/js/components/whitelabel/wallet/components/ikonotv/ikonotv_register_piece.js @@ -10,24 +10,18 @@ import Row from 'react-bootstrap/lib/Row'; import PieceListStore from '../../../../../stores/piece_list_store'; import PieceListActions from '../../../../../actions/piece_list_actions'; -import UserStore from '../../../../../stores/user_store'; -import UserActions from '../../../../../actions/user_actions'; - import PieceStore from '../../../../../stores/piece_store'; import PieceActions from '../../../../../actions/piece_actions'; -import WhitelabelActions from '../../../../../actions/whitelabel_actions'; -import WhitelabelStore from '../../../../../stores/whitelabel_store'; - import GlobalNotificationModel from '../../../../../models/global_notification_model'; import GlobalNotificationActions from '../../../../../actions/global_notification_actions'; -import RegisterPieceForm from '../../../../ascribe_forms/form_register_piece'; -import LoanForm from '../../../../ascribe_forms/form_loan'; - import IkonotvArtistDetailsForm from './ikonotv_forms/ikonotv_artist_details_form'; import IkonotvArtworkDetailsForm from './ikonotv_forms/ikonotv_artwork_details_form'; +import RegisterPieceForm from '../../../../ascribe_forms/form_register_piece'; +import LoanForm from '../../../../ascribe_forms/form_loan'; + import SlidesContainer from '../../../../ascribe_slides_container/slides_container'; import ApiUrls from '../../../../../constants/api_urls'; @@ -38,8 +32,14 @@ import { getLangText } from '../../../../../utils/lang_utils'; let IkonotvRegisterPiece = React.createClass({ propTypes: { - handleSuccess: React.PropTypes.func, piece: React.PropTypes.object.isRequired, + handleSuccess: React.PropTypes.func, + + // Provided from PrizeApp + currentUser: React.PropTypes.object, + whitelabel: React.PropTypes.object, + + // Provided from router location: React.PropTypes.object }, @@ -47,10 +47,8 @@ let IkonotvRegisterPiece = React.createClass({ getInitialState(){ return mergeOptions( - UserStore.getState(), PieceListStore.getState(), PieceStore.getState(), - WhitelabelStore.getState(), { step: 0, pageExitWarning: getLangText("If you leave this form now, your work will not be loaned to Ikono TV.") @@ -59,18 +57,12 @@ let IkonotvRegisterPiece = React.createClass({ componentDidMount() { PieceListStore.listen(this.onChange); - UserStore.listen(this.onChange); PieceStore.listen(this.onChange); - WhitelabelStore.listen(this.onChange); - UserActions.fetchCurrentUser(); - WhitelabelActions.fetchWhitelabel(); // Before we load the new piece, we reset the piece store to delete old data that we do // not want to display to the user. PieceActions.updatePiece({}); - let queryParams = this.props.location.query; - // Since every step of this register process is atomic, // we may need to enter the process at step 1 or 2. // If this is the case, we'll need the piece number to complete submission. @@ -78,6 +70,7 @@ let IkonotvRegisterPiece = React.createClass({ // // We're using 'in' here as we want to know if 'piece_id' is present in the url, // we don't care about the value. + const queryParams = this.props.location.query; if (queryParams && 'piece_id' in queryParams) { PieceActions.fetchOne(queryParams.piece_id); } @@ -85,9 +78,7 @@ let IkonotvRegisterPiece = React.createClass({ componentWillUnmount() { PieceListStore.unlisten(this.onChange); - UserStore.unlisten(this.onChange); PieceStore.unlisten(this.onChange); - WhitelabelStore.listen(this.onChange); }, onChange(state) { @@ -158,8 +149,7 @@ let IkonotvRegisterPiece = React.createClass({ }, canSubmit() { - let currentUser = this.state.currentUser; - let whitelabel = this.state.whitelabel; + const { currentUser, whitelabel } = this.props; return currentUser && currentUser.acl && currentUser.acl.acl_wallet_submit && whitelabel && whitelabel.user; }, @@ -199,10 +189,9 @@ let IkonotvRegisterPiece = React.createClass({ getSlideLoan() { if (this.canSubmit()) { - const { piece, whitelabel } = this.state; - let today = new Moment(); - let endDate = new Moment(); - endDate.add(2, 'years'); + const { piece, whitelabel } = this.props; + const today = new Moment(); + const endDate = (new Moment()).add(2, 'years'); return (
@@ -252,7 +241,7 @@ let IkonotvRegisterPiece = React.createClass({ submitMessage={getLangText('Register')} isFineUploaderActive={true} handleSuccess={this.handleRegisterSuccess} - location={this.props.location}/> + location={this.props.location} />