Change AccordionListItems and parents for loading UserStore from top level app

js/components/ascribe_accordion_list/accordion_list_item.js

@@ -21,7 +21,8 @@ let AccordionListItem = React.createClass({
     },
 
     render() {
-        const { linkData,
+        const {
+            linkData,
             className,
             thumbnail,
             heading,
@@ -31,7 +32,6 @@ let AccordionListItem = React.createClass({
             badge,
             children } = this.props;
 
-
         return (
             <div className="row">
                 <div className={className}>

js/components/ascribe_accordion_list/accordion_list_item_piece.js

@@ -34,11 +34,10 @@ let AccordionListItemPiece = React.createClass({
     },
 
     getLinkData() {
-        let { piece } = this.props;
+        const { piece } = this.props;
 
         if (piece && piece.first_edition) {
             return `/editions/${piece.first_edition.bitcoin_id}`;
-
         } else {
             return `/pieces/${piece.id}`;
         }

js/components/ascribe_accordion_list/accordion_list_item_wallet.js

@@ -29,8 +29,9 @@ import { mergeOptions } from '../../utils/general_utils';
 
 let AccordionListItemWallet = React.createClass({
     propTypes: {
+        content: React.PropTypes.object.isRequired,
+
         className: React.PropTypes.string,
-        content: React.PropTypes.object,
         thumbnailPlaceholder: React.PropTypes.func,
         children: React.PropTypes.oneOfType([
             React.PropTypes.arrayOf(React.PropTypes.element),
@@ -63,7 +64,7 @@ let AccordionListItemWallet = React.createClass({
     },
 
     getGlyphicon() {
-        if ((this.props.content.notifications && this.props.content.notifications.length > 0)){
+        if (this.props.content.notifications && this.props.content.notifications.length){
             return (
                 <OverlayTrigger
                     delay={500}

js/components/piece_list.js

@@ -325,13 +325,14 @@ let PieceList = React.createClass({
                     page={this.state.page}
                     pageSize={this.state.pageSize}
                     loadingElement={loadingElement}>
-                    {this.state.pieceList.map((piece, i) => {
+                    {this.state.pieceList.map((piece) => {
                         return (
                             <AccordionListItemType
+                                key={piece.id}
                                 className="col-xs-12 col-sm-10 col-md-8 col-lg-8 col-sm-offset-1 col-md-offset-2 col-lg-offset-2 ascribe-accordion-list-item"
                                 content={piece}
-                                thumbnailPlaceholder={customThumbnailPlaceholder}
-                                key={i}>
+                                currentUser={currentUser}
+                                thumbnailPlaceholder={customThumbnailPlaceholder}>
                                     <AccordionListItemTableEditions
                                         className="ascribe-accordion-list-item-table col-xs-12 col-sm-10 col-md-8 col-lg-8 col-sm-offset-1 col-md-offset-2 col-lg-offset-2"
                                         parentId={piece.id} />

js/components/whitelabel/prize/simple_prize/components/ascribe_accordion_list/accordion_list_item_prize.js

@@ -10,8 +10,6 @@ import PieceListStore from '../../../../../../stores/piece_list_store';
 
 import PrizeRatingActions from '../../actions/prize_rating_actions';
 
-import UserStore from '../../../../../../stores/user_store';
-
 import InputCheckbox from '../../../../../ascribe_forms/input_checkbox';
 
 import AccordionListItemPiece from '../../../../../ascribe_accordion_list/accordion_list_item_piece';
@@ -23,13 +21,14 @@ import AclProxy from '../../../../../acl_proxy';
 import SubmitToPrizeButton from './../ascribe_buttons/submit_to_prize_button';
 
 import { getLangText } from '../../../../../../utils/lang_utils';
-import { mergeOptions } from '../../../../../../utils/general_utils';
 
 
 let AccordionListItemPrize = React.createClass({
     propTypes: {
+        content: React.PropTypes.object.isRequired,
+        currentUser: React.PropTypes.object.isRequired,
+
         className: React.PropTypes.string,
-        content: React.PropTypes.object,
         children: React.PropTypes.oneOfType([
             React.PropTypes.arrayOf(React.PropTypes.element),
             React.PropTypes.element
@@ -37,20 +36,15 @@ let AccordionListItemPrize = React.createClass({
     },
 
     getInitialState() {
-        return mergeOptions(
-            PieceListStore.getState(),
-            UserStore.getState()
-        );
+        return PieceListStore.getState();
     },
 
     componentDidMount() {
         PieceListStore.listen(this.onChange);
-        UserStore.listen(this.onChange);
     },
 
     componentWillUnmount() {
         PieceListStore.unlisten(this.onChange);
-        UserStore.unlisten(this.onChange);
     },
 
     onChange(state) {
@@ -61,29 +55,30 @@ let AccordionListItemPrize = React.createClass({
         PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search,
                                         this.state.orderBy, this.state.orderAsc, this.state.filterBy);
 
-        let notification = new GlobalNotificationModel(response.notification, 'success', 10000);
+        const notification = new GlobalNotificationModel(response.notification, 'success', 10000);
         GlobalNotificationActions.appendGlobalNotification(notification);
     },
 
     getPrizeButtons() {
-        if (this.state.currentUser && this.state.currentUser.is_jury){
-            if ((this.props.content.ratings) &&
-                (this.props.content.ratings.rating || this.props.content.ratings.average)){
+        const { currentUser, content: { id, ratings } } = this.props;
+
+        if (currentUser && (currentUser.is_jury || currentUser.is_judge)) {
+            if (ratings && (ratings.rating || ratings.average)) {
                 // jury and rating available
-                let rating = null,
-                    caption = null;
-                if (this.props.content.ratings.rating){
-                    rating = parseInt(this.props.content.ratings.rating, 10);
+                let rating = null;
+                let caption = null;
+
+                if (ratings.rating) {
+                    rating = parseInt(ratings.rating, 10);
                     caption = getLangText('Your rating');
-                }
-                else if (this.props.content.ratings.average){
-                    rating = this.props.content.ratings.average;
-                    caption = getLangText('Average of ' + this.props.content.ratings.num_ratings + ' rating(s)');
+                } else if (ratings.average) {
+                    rating = ratings.average;
+                    caption = getLangText('Average of ' + ratings.num_ratings + ' rating(s)');
                 }
 
                 return (
                     <div id="list-rating" className="pull-right">
-                        <Link to={`/pieces/${this.props.content.id}`}>
+                        <Link to={`/pieces/${id}`}>
                             <StarRating
                                 ref='rating'
                                 name="prize-rating"
@@ -94,25 +89,25 @@ let AccordionListItemPrize = React.createClass({
                                 ratingAmount={5} />
                         </Link>
                     </div>);
-            }
-            else {
-                if (this.state.currentUser.is_judge){
+            } else {
+                if (currentUser.is_judge) {
                     return (
                         <div className="react-rating-caption pull-right">
                             {getLangText('Not rated')}
                         </div>
                     );
-                }
+                } else {
                     // jury and no rating yet
                     return (
                         <div className="react-rating-caption pull-right">
-                        <Link to={`/pieces/${this.props.content.id}`}>
+                            <Link to={`/pieces/${id}`}>
                                 {getLangText('Submit your rating')}
                             </Link>
                         </div>
                     );
                 }
             }
+        }
         return this.getPrizeButtonsParticipant();
 
     },
@@ -133,7 +128,7 @@ let AccordionListItemPrize = React.createClass({
     },
 
     handleShortlistSuccess(message) {
-        let notification = new GlobalNotificationModel(message, 'success', 2000);
+        const notification = new GlobalNotificationModel(message, 'success', 2000);
         GlobalNotificationActions.appendGlobalNotification(notification);
     },
 
@@ -144,21 +139,15 @@ let AccordionListItemPrize = React.createClass({
 
     onSelectChange() {
         PrizeRatingActions.toggleShortlist(this.props.content.id)
-        .then(
-            (res) => {
+        .then((res) => {
             this.refreshPieceData();
-                return res;
-            })
-        .then(
-            (res) => {
             this.handleShortlistSuccess(res.notification);
-            }
-        );
+        });
 
     },
 
     getPrizeBadge() {
-        if (this.state.currentUser && this.state.currentUser.is_judge) {
+        if (currentUser && currentUser.is_judge) {
             return (
                 <span className="pull-right ascribe-checkbox-wrapper ascribe-checkbox-badge">
                     <InputCheckbox
@@ -166,17 +155,18 @@ let AccordionListItemPrize = React.createClass({
                         onChange={this.onSelectChange}/>
                 </span>
             );
-        }
+        } else {
             return null;
+        }
     },
 
     render() {
-        const { children, className, content } = this.props;
-        const { currentUser } = this.state;
+        const { children, className, content, currentUser } = this.props;
 
         // Only show the artist name if you are the participant or if you are a judge and the piece is shortlisted
-        let artistName = ((currentUser.is_jury && !currentUser.is_judge) || (currentUser.is_judge && !content.selected )) ?
+        const artistName = ((currentUser.is_jury && !currentUser.is_judge) || (currentUser.is_judge && !content.selected )) ?
                 <span className="glyphicon glyphicon-eye-close" aria-hidden="true"/> : content.artist_name;
+
         return (
             <div>
                 <AccordionListItemPiece
@@ -186,7 +176,8 @@ let AccordionListItemPrize = React.createClass({
                     subsubheading={
                         <div>
                             <span>{Moment(content.date_created, 'YYYY-MM-DD').year()}</span>
-                        </div>}
+                        </div>
+                    }
                     buttons={this.getPrizeButtons()}
                     badge={this.getPrizeBadge()}>
                     {children}

js/components/whitelabel/wallet/components/cyland/cyland_accordion_list/cyland_accordion_list_item.js

@@ -3,27 +3,26 @@
 import React from 'react';
 import Moment from 'moment';
 
-import AccordionListItemPiece from '../../../../../ascribe_accordion_list/accordion_list_item_piece';
+import GlobalNotificationModel from '../../../../../../models/global_notification_model';
+import GlobalNotificationActions from '../../../../../../actions/global_notification_actions';
 
 import PieceListActions from '../../../../../../actions/piece_list_actions';
 import PieceListStore from '../../../../../../stores/piece_list_store';
 
-import UserStore from '../../../../../../stores/user_store';
-
-import GlobalNotificationModel from '../../../../../../models/global_notification_model';
-import GlobalNotificationActions from '../../../../../../actions/global_notification_actions';
-
 import CylandSubmitButton from '../cyland_buttons/cyland_submit_button';
+
+import AccordionListItemPiece from '../../../../../ascribe_accordion_list/accordion_list_item_piece';
+
 import AclProxy from '../../../../../acl_proxy';
 
 import { getLangText } from '../../../../../../utils/lang_utils';
-import { mergeOptions } from '../../../../../../utils/general_utils';
 
 
 let CylandAccordionListItem = React.createClass({
     propTypes: {
+        content: React.PropTypes.object.isRequired,
+
         className: React.PropTypes.string,
-        content: React.PropTypes.object,
         children: React.PropTypes.oneOfType([
             React.PropTypes.arrayOf(React.PropTypes.element),
             React.PropTypes.element
@@ -31,20 +30,15 @@ let CylandAccordionListItem = React.createClass({
     },
 
     getInitialState() {
-        return mergeOptions(
-            PieceListStore.getState(),
-            UserStore.getState()
-        );
+        return PieceListStore.getState();
     },
 
     componentDidMount() {
         PieceListStore.listen(this.onChange);
-        UserStore.listen(this.onChange);
     },
 
     componentWillUnmount() {
         PieceListStore.unlisten(this.onChange);
-        UserStore.unlisten(this.onChange);
     },
 
     onChange(state) {
@@ -55,23 +49,25 @@ let CylandAccordionListItem = React.createClass({
         PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search,
                                         this.state.orderBy, this.state.orderAsc, this.state.filterBy);
 
-        let notification = new GlobalNotificationModel(response.notification, 'success', 10000);
+        const notification = new GlobalNotificationModel(response.notification, 'success', 10000);
         GlobalNotificationActions.appendGlobalNotification(notification);
     },
 
     getSubmitButtons() {
+        const { content } = this.props;
+
         return (
             <div>
                 <AclProxy
-                    aclObject={this.props.content.acl}
+                    aclObject={content.acl}
                     aclName="acl_wallet_submit">
                     <CylandSubmitButton
                         className="pull-right"
-                        piece={this.props.content}
+                        piece={content}
                         handleSuccess={this.handleSubmitSuccess}/>
                 </AclProxy>
                 <AclProxy
-                    aclObject={this.props.content.acl}
+                    aclObject={content.acl}
                     aclName="acl_wallet_submitted">
                     <button
                         disabled
@@ -81,7 +77,7 @@ let CylandAccordionListItem = React.createClass({
                     </button>
                 </AclProxy>
                 <AclProxy
-                    aclObject={this.props.content.acl}
+                    aclObject={content.acl}
                     aclName="acl_wallet_accepted">
                     <button
                         disabled
@@ -95,16 +91,19 @@ let CylandAccordionListItem = React.createClass({
     },
 
     render() {
+        const { children, className, content } = this.props;
+
         return (
             <AccordionListItemPiece
-                className={this.props.className}
-                piece={this.props.content}
+                className={className}
+                piece={content}
                 subsubheading={
                     <div className="pull-left">
-                        <span>{Moment(this.props.content.date_created, 'YYYY-MM-DD').year()}</span>
-                    </div>}
+                        <span>{Moment(content.date_created, 'YYYY-MM-DD').year()}</span>
+                    </div>
+                }
                 buttons={this.getSubmitButtons()}>
-                {this.props.children}
+                {children}
             </AccordionListItemPiece>
         );
     }

js/components/whitelabel/wallet/components/ikonotv/ikonotv_accordion_list/ikonotv_accordion_list_item.js

@@ -3,18 +3,16 @@
 import React from 'react';
 import Moment from 'moment';
 
-import AccordionListItemPiece from '../../../../../ascribe_accordion_list/accordion_list_item_piece';
+import GlobalNotificationModel from '../../../../../../models/global_notification_model';
+import GlobalNotificationActions from '../../../../../../actions/global_notification_actions';
 
 import PieceListActions from '../../../../../../actions/piece_list_actions';
 import PieceListStore from '../../../../../../stores/piece_list_store';
 
-import UserStore from '../../../../../../stores/user_store';
-
-import GlobalNotificationModel from '../../../../../../models/global_notification_model';
-import GlobalNotificationActions from '../../../../../../actions/global_notification_actions';
-
 import IkonotvSubmitButton from '../ikonotv_buttons/ikonotv_submit_button';
 
+import AccordionListItemPiece from '../../../../../ascribe_accordion_list/accordion_list_item_piece';
+
 import AclProxy from '../../../../../acl_proxy';
 
 import { getLangText } from '../../../../../../utils/lang_utils';
@@ -23,8 +21,10 @@ import { mergeOptions } from '../../../../../../utils/general_utils';
 
 let IkonotvAccordionListItem = React.createClass({
     propTypes: {
+        content: React.PropTypes.object.isRequired,
+        currentUser: React.PropTypes.object.isRequired,
+
         className: React.PropTypes.string,
-        content: React.PropTypes.object,
         children: React.PropTypes.oneOfType([
             React.PropTypes.arrayOf(React.PropTypes.element),
             React.PropTypes.element
@@ -32,20 +32,15 @@ let IkonotvAccordionListItem = React.createClass({
     },
 
     getInitialState() {
-        return mergeOptions(
-            PieceListStore.getState(),
-            UserStore.getState()
-        );
+        return PieceListStore.getState();
     },
 
     componentDidMount() {
         PieceListStore.listen(this.onChange);
-        UserStore.listen(this.onChange);
     },
 
     componentWillUnmount() {
         PieceListStore.unlisten(this.onChange);
-        UserStore.unlisten(this.onChange);
     },
 
     onChange(state) {
@@ -56,27 +51,29 @@ let IkonotvAccordionListItem = React.createClass({
         PieceListActions.fetchPieceList(this.state.page, this.state.pageSize, this.state.search,
                                         this.state.orderBy, this.state.orderAsc, this.state.filterBy);
 
-        let notification = new GlobalNotificationModel(response.notification, 'success', 10000);
+        const notification = new GlobalNotificationModel(response.notification, 'success', 10000);
         GlobalNotificationActions.appendGlobalNotification(notification);
     },
 
     getSubmitButtons() {
+        const { content, currentUser } = this.props;
+
         return (
             <div>
                 <AclProxy
-                    aclObject={this.state.currentUser.acl}
+                    aclObject={currentUser.acl}
                     aclName="acl_wallet_submit">
                     <AclProxy
-                        aclObject={this.props.content.acl}
+                        aclObject={content.acl}
                         aclName="acl_wallet_submit">
                         <IkonotvSubmitButton
                             className="btn-xs pull-right"
                             handleSuccess={this.handleSubmitSuccess}
-                            piece={this.props.content}/>
+                            piece={content}/>
                     </AclProxy>
                 </AclProxy>
                 <AclProxy
-                    aclObject={this.props.content.acl}
+                    aclObject={content.acl}
                     aclName="acl_wallet_submitted">
                     <button
                         disabled
@@ -86,7 +83,7 @@ let IkonotvAccordionListItem = React.createClass({
                     </button>
                 </AclProxy>
                 <AclProxy
-                    aclObject={this.props.content.acl}
+                    aclObject={content.acl}
                     aclName="acl_wallet_accepted">
                     <button
                         disabled
@@ -100,22 +97,21 @@ let IkonotvAccordionListItem = React.createClass({
     },
 
     render() {
-        if(this.props.content) {
+        const { children, className, content } = this.props;
+
         return (
             <AccordionListItemPiece
-                    className={this.props.className}
-                    piece={this.props.content}
+                className={className}
+                piece={content}
                 subsubheading={
                     <div className="pull-left">
-                            <span>{Moment(this.props.content.date_created, 'YYYY-MM-DD').year()}</span>
-                        </div>}
+                        <span>{Moment(content.date_created, 'YYYY-MM-DD').year()}</span>
+                    </div>
+                }
                 buttons={this.getSubmitButtons()}>
-                    {this.props.children}
+                {children}
             </AccordionListItemPiece>
         );
-        } else {
-            return null;
-        }
     }
 });