Change AclButtonList and parents for loading UserStore from top level app

This commit is contained in:
Brett Sun 2016-01-11 17:41:31 +01:00
parent f31d6352eb
commit d4bb00168c
8 changed files with 98 additions and 141 deletions

View File

@ -2,9 +2,6 @@
import React from 'react/addons';
import UserActions from '../../actions/user_actions';
import UserStore from '../../stores/user_store';
import ConsignButton from './acls/consign_button';
import EmailButton from './acls/email_button';
import LoanButton from './acls/loan_button';
@ -12,50 +9,44 @@ import LoanRequestButton from './acls/loan_request_button';
import TransferButton from './acls/transfer_button';
import UnconsignButton from './acls/unconsign_button';
import { mergeOptions } from '../../utils/general_utils';
import { selectFromObject } from '../../utils/general_utils';
let AclButtonList = React.createClass({
propTypes: {
className: React.PropTypes.string,
availableAcls: React.PropTypes.object.isRequired,
currentUser: React.PropTypes.object.isRequired,
handleSuccess: React.PropTypes.func.isRequired,
pieceOrEditions: React.PropTypes.oneOfType([
React.PropTypes.object,
React.PropTypes.array
]).isRequired,
availableAcls: React.PropTypes.object.isRequired,
buttonsStyle: React.PropTypes.object,
handleSuccess: React.PropTypes.func.isRequired,
children: React.PropTypes.oneOfType([
React.PropTypes.arrayOf(React.PropTypes.element),
React.PropTypes.element
])
]),
className: React.PropTypes.string
},
getInitialState() {
return mergeOptions(
UserStore.getState(),
{
buttonListSize: 0
}
);
return {
buttonListSize: 0
}
},
componentDidMount() {
UserStore.listen(this.onChange);
UserActions.fetchCurrentUser.defer();
window.addEventListener('resize', this.handleResize);
window.dispatchEvent(new Event('resize'));
},
componentDidUpdate(prevProps) {
if(prevProps.availableAcls && prevProps.availableAcls !== this.props.availableAcls) {
if (prevProps.availableAcls && prevProps.availableAcls !== this.props.availableAcls) {
window.dispatchEvent(new Event('resize'));
}
},
componentWillUnmount() {
UserStore.unlisten(this.onChange);
window.removeEventListener('resize', this.handleResize);
},
@ -65,10 +56,6 @@ let AclButtonList = React.createClass({
});
},
onChange(state) {
this.setState(state);
},
renderChildren() {
const { children } = this.props;
const { buttonListSize } = this.state;
@ -79,42 +66,29 @@ let AclButtonList = React.createClass({
},
render() {
const { className,
buttonsStyle,
availableAcls,
pieceOrEditions,
handleSuccess } = this.props;
const {
availableAcls,
buttonsStyle,
className,
currentUser,
handleSuccess,
pieceOrEditions } = this.props;
const { currentUser } = this.state;
const buttonProps = selectFromObject(this.props, [
'availableAcls',
'currentUser',
'handleSuccess',
'pieceOrEditions'
]);
return (
<div className={className}>
<span ref="buttonList" style={buttonsStyle}>
<EmailButton
availableAcls={availableAcls}
pieceOrEditions={pieceOrEditions}
currentUser={currentUser}
handleSuccess={handleSuccess} />
<TransferButton
availableAcls={availableAcls}
pieceOrEditions={pieceOrEditions}
currentUser={currentUser}
handleSuccess={handleSuccess}/>
<ConsignButton
availableAcls={availableAcls}
pieceOrEditions={pieceOrEditions}
currentUser={currentUser}
handleSuccess={handleSuccess} />
<UnconsignButton
availableAcls={availableAcls}
pieceOrEditions={pieceOrEditions}
currentUser={currentUser}
handleSuccess={handleSuccess} />
<LoanButton
availableAcls={availableAcls}
pieceOrEditions={pieceOrEditions}
currentUser={currentUser}
handleSuccess={handleSuccess} />
<EmailButton {...buttonProps} />
<TransferButton {...buttonProps} />
<ConsignButton {...buttonProps} />
<UnconsignButton {...buttonProps} />
<LoanButton {...buttonProps} />
{this.renderChildren()}
</span>
</div>

View File

@ -37,10 +37,9 @@ export default function ({ action, displayName, title, tooltip }) {
},
sanitizeAction() {
if (this.props.buttonAcceptName) {
return this.props.buttonAcceptName;
}
return AclInformationText.titles[action];
const { buttonAcceptName } = this.props;
return buttonAcceptName ? buttonAcceptName : AclInformationText.titles[action];
},
render() {

View File

@ -36,9 +36,10 @@ import { getLangText } from '../../utils/lang_utils';
*/
let EditionActionPanel = React.createClass({
propTypes: {
edition: React.PropTypes.object.isRequired,
currentUser: React.PropTypes.object.isRequired,
actionPanelButtonListType: React.PropTypes.func,
edition: React.PropTypes.object,
currentUser: React.PropTypes.object,
handleSuccess: React.PropTypes.func
},
@ -72,7 +73,7 @@ let EditionActionPanel = 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');
@ -99,24 +100,22 @@ let EditionActionPanel = React.createClass({
edition,
currentUser } = this.props;
if (edition &&
edition.notifications &&
if (edition.notifications &&
edition.notifications.length > 0){
return (
<ListRequestActions
pieceOrEditions={[edition]}
currentUser={currentUser}
handleSuccess={this.handleSuccess}
notifications={edition.notifications}/>);
}
else {
notifications={edition.notifications}
pieceOrEditions={[edition]}
handleSuccess={this.handleSuccess} />);
} else {
return (
<Row>
<Col md={12}>
<ActionPanelButtonListType
className="ascribe-button-list"
availableAcls={edition.acl}
className="ascribe-button-list"
currentUser={currentUser}
pieceOrEditions={[edition]}
handleSuccess={this.handleSuccess}>
<AclProxy

View File

@ -210,10 +210,10 @@ let PieceContainer = React.createClass({
if (piece && piece.notifications && piece.notifications.length > 0) {
return (
<ListRequestActions
pieceOrEditions={piece}
currentUser={currentUser}
handleSuccess={this.loadPiece}
notifications={piece.notifications}/>);
pieceOrEditions={piece}
notifications={piece.notifications}
handleSuccess={this.loadPiece} />);
} else {
return (
<AclProxy
@ -227,8 +227,9 @@ let PieceContainer = React.createClass({
label={getLangText('ACTIONS')}
className="hidden-print">
<AclButtonList
className="ascribe-button-list"
availableAcls={piece.acl}
className="ascribe-button-list"
currentUser={currentUser}
pieceOrEditions={piece}
handleSuccess={this.loadPiece}>
<CreateEditionsButton

View File

@ -263,6 +263,7 @@ let PieceList = React.createClass({
const {
accordionListItemType: AccordionListItemType,
bulkModalButtonListType: BulkModalButtonListType,
currentUser,
customSubmitButton,
customThumbnailPlaceholder,
filterParams,
@ -299,6 +300,7 @@ let PieceList = React.createClass({
className="ascribe-piece-list-bulk-modal">
<BulkModalButtonListType
availableAcls={availableAcls}
currentUser={currentUser}
pieceOrEditions={selectedEditions}
handleSuccess={this.handleAclSuccess}
className="text-center ascribe-button-list collapse-group">

View File

@ -20,49 +20,49 @@ let WalletActionPanel = React.createClass({
submitButtonType: React.PropTypes.func.isRequired
},
render(){
if (this.props.piece &&
this.props.piece.notifications &&
this.props.piece.notifications.length > 0) {
render() {
const { currentUser, handleDeleteSuccess, loadPiece, piece, submitButtonType } = this.props;
if (piece && piece.notifications && piece.notifications.length) {
return (
<ListRequestActions
pieceOrEditions={this.props.piece}
currentUser={this.props.currentUser}
handleSuccess={this.props.loadPiece}
notifications={this.props.piece.notifications}/>);
}
else {
pieceOrEditions={piece}
currentUser={currentUser}
handleSuccess={loadPiece}
notifications={piece.notifications}/>);
} else {
//We need to disable the normal acl_loan because we're inserting a custom acl_loan button
let availableAcls;
if (this.props.piece && this.props.piece.acl && typeof this.props.piece.acl.acl_loan !== 'undefined') {
if (piece && piece.acl && typeof piece.acl.acl_loan !== 'undefined') {
// make a copy to not have side effects
availableAcls = mergeOptions({}, this.props.piece.acl);
availableAcls = mergeOptions({}, piece.acl);
availableAcls.acl_loan = false;
}
let SubmitButtonType = this.props.submitButtonType;
let SubmitButtonType = submitButtonType;
return (
<AclButtonList
className="text-center ascribe-button-list"
availableAcls={availableAcls}
pieceOrEditions={this.props.piece}
handleSuccess={this.props.loadPiece}>
className="text-center ascribe-button-list"
currentUser={currentUser}
pieceOrEditions={piece}
handleSuccess={loadPiece}>
<AclProxy
aclObject={this.props.currentUser.acl}
aclObject={currentUser.acl}
aclName="acl_wallet_submit">
<AclProxy
aclObject={availableAcls}
aclName="acl_wallet_submit">
<SubmitButtonType
className="btn-sm"
piece={this.props.piece}/>
piece={piece}/>
</AclProxy>
</AclProxy>
<DeleteButton
handleSuccess={this.props.handleDeleteSuccess}
piece={this.props.piece}/>
handleSuccess={handleDeleteSuccess}
piece={piece}/>
</AclButtonList>
);
}

View File

@ -19,7 +19,7 @@ let CylandLanding = React.createClass({
whitelabel: React.PropTypes.object,
// Provided from router
location: object
location: React.PropTypes.object
},
render() {

View File

@ -9,63 +9,45 @@ import EmailButton from '../../../../../ascribe_buttons/acls/email_button';
import TransferButton from '../../../../../ascribe_buttons/acls/transfer_button';
import UnconsignButton from '../../../../../ascribe_buttons/acls/unconsign_button';
import UserActions from '../../../../../../actions/user_actions';
import UserStore from '../../../../../../stores/user_store';
import { selectFromObject } from '../../../../../../utils/general_utils';
let MarketAclButtonList = React.createClass({
propTypes: {
availableAcls: React.PropTypes.object.isRequired,
className: React.PropTypes.string,
pieceOrEditions: React.PropTypes.array,
handleSuccess: React.PropTypes.func,
currentUser: React.PropTypes.object.isRequired,
handleSuccess: React.PropTypes.func.isRequired,
pieceOrEditions: React.PropTypes.array.isRequired,
children: React.PropTypes.oneOfType([
React.PropTypes.arrayOf(React.PropTypes.element),
React.PropTypes.element
])
},
getInitialState() {
return UserStore.getState();
},
componentDidMount() {
UserStore.listen(this.onChange);
UserActions.fetchCurrentUser();
},
componentWillUnmount() {
UserStore.unlisten(this.onChange);
},
onChange(state) {
this.setState(state);
]),
className: React.PropTypes.string
},
render() {
let { availableAcls, className, pieceOrEditions, handleSuccess } = this.props;
const {
availableAcls,
children,
className,
currentUser,
handleSuccess,
pieceOrEditions } = this.props;
const buttonProps = selectFromObject(this.props, [
'availableAcls',
'currentUser',
'handleSuccess',
'pieceOrEditions'
]);
return (
<div className={className}>
<MarketSubmitButton
availableAcls={availableAcls}
currentUser={this.state.currentUser}
editions={pieceOrEditions}
handleSuccess={handleSuccess} />
<EmailButton
availableAcls={availableAcls}
currentUser={this.state.currentUser}
pieceOrEditions={pieceOrEditions}
handleSuccess={handleSuccess} />
<TransferButton
availableAcls={availableAcls}
currentUser={this.state.currentUser}
pieceOrEditions={pieceOrEditions}
handleSuccess={handleSuccess} />
<UnconsignButton
availableAcls={availableAcls}
currentUser={this.state.currentUser}
pieceOrEditions={pieceOrEditions}
handleSuccess={handleSuccess} />
{this.props.children}
<MarketSubmitButton {...buttonProps} />
<EmailButton {...buttonProps} />
<TransferButton {...buttonProps} />
<UnconsignButton {...buttonProps} />
{children}
</div>
);
}