notifications on piece details (www, ikono, cyland) and edition details

js/actions/notification_actions.js

@@ -8,7 +8,9 @@ class NotificationActions {
     constructor() {
         this.generateActions(
             'updatePieceListNotifications',
-            'updateEditionListNotifications'
+            'updateEditionListNotifications',
+            'updateEditionNotifications',
+            'updatePieceNotifications'
         );
     }
 
@@ -21,6 +23,15 @@ class NotificationActions {
             .catch((err) => console.logGlobal(err));
     }
 
+    fetchPieceNotifications(pieceId) {
+        NotificationFetcher
+            .fetchPieceNotifications(pieceId)
+            .then((res) => {
+                this.actions.updatePieceNotifications(res);
+            })
+            .catch((err) => console.logGlobal(err));
+    }
+
     fetchEditionListNotifications() {
         NotificationFetcher
             .fetchEditionListNotifications()
@@ -29,6 +40,15 @@ class NotificationActions {
             })
             .catch((err) => console.logGlobal(err));
     }
+
+    fetchEditionNotifications(editionId) {
+        NotificationFetcher
+            .fetchEditionNotifications(editionId)
+            .then((res) => {
+                this.actions.updateEditionNotifications(res);
+            })
+            .catch((err) => console.logGlobal(err));
+    }
 }
 
 export default alt.createActions(NotificationActions);

js/components/ascribe_detail/edition.js

@@ -16,6 +16,9 @@ import PieceListActions from '../../actions/piece_list_actions';
 import PieceListStore from '../../stores/piece_list_store';
 import EditionListActions from '../../actions/edition_list_actions';
 
+import NotificationActions from '../../actions/notification_actions';
+import NotificationStore from '../../stores/notification_store';
+
 import HistoryIterator from './history_iterator';
 
 import MediaContainer from './media_container';
@@ -208,6 +211,25 @@ let EditionSummary = React.createClass({
         handleDeleteSuccess: React.PropTypes.func
     },
 
+    getInitialState() {
+        return mergeOptions(
+            NotificationStore.getState()
+        );
+    },
+
+    componentDidMount() {
+        NotificationStore.listen(this.onChange);
+        NotificationActions.fetchEditionNotifications(this.props.edition.bitcoin_id);
+    },
+
+    componentWillUnmount() {
+        NotificationStore.unlisten(this.onChange);
+    },
+
+    onChange(state) {
+        this.setState(state);
+    },
+
     getTransferWithdrawData(){
         return {'bitcoin_id': this.props.edition.bitcoin_id};
     },
@@ -234,13 +256,13 @@ let EditionSummary = React.createClass({
 
     getActions(){
         let actions = null;
-        if (this.props.edition.request_action && this.props.edition.request_action.length > 0){
+        if (this.state.editionNotifications && this.state.editionNotifications.notification){
             actions = (
                 <ListRequestActions
                     pieceOrEditions={[this.props.edition]}
                     currentUser={this.props.currentUser}
                     handleSuccess={this.showNotification}
-                    requestActions={this.props.edition.request_action}/>);
+                    requestActions={this.state.editionNotifications.notification}/>);
         }
 
         else {

js/components/ascribe_detail/piece_container.js

@@ -9,6 +9,9 @@ import PieceStore from '../../stores/piece_store';
 import PieceListActions from '../../actions/piece_list_actions';
 import PieceListStore from '../../stores/piece_list_store';
 
+import NotificationActions from '../../actions/notification_actions';
+import NotificationStore from '../../stores/notification_store';
+
 import UserActions from '../../actions/user_actions';
 import UserStore from '../../stores/user_store';
 
@@ -62,6 +65,8 @@ let PieceContainer = React.createClass({
         UserActions.fetchCurrentUser();
         PieceStore.listen(this.onChange);
         PieceActions.fetchOne(this.props.params.pieceId);
+        NotificationStore.listen(this.onChange);
+        NotificationActions.fetchPieceNotifications(this.props.params.pieceId);
     },
 
     componentWillUnmount() {
@@ -73,6 +78,7 @@ let PieceContainer = React.createClass({
         PieceStore.unlisten(this.onChange);
         UserStore.unlisten(this.onChange);
         PieceListStore.unlisten(this.onChange);
+        NotificationStore.unlisten(this.onChange);
     },
 
     onChange(state) {
@@ -172,17 +178,16 @@ let PieceContainer = React.createClass({
         return {'id': this.state.piece.id};
     },
 
-    getActions(){
+    getActions() {
         if (this.state.piece &&
-            this.state.piece.request_action &&
+            this.state.pieceNotifications &&
-            this.state.piece.request_action.length > 0) {
+            this.state.pieceNotifications.notification) {
             return (
                 <ListRequestActions
                     pieceOrEditions={this.state.piece}
                     currentUser={this.state.currentUser}
                     handleSuccess={this.loadPiece}
-                    requestActions={this.state.piece.request_action}/>
+                    requestActions={this.state.pieceNotifications.notification}/>);
-                );
         }
         else {
             return (

js/components/ascribe_forms/form_request_action.js

@@ -6,7 +6,7 @@ import AclButton from './../ascribe_buttons/acl_button';
 import ActionPanel from '../ascribe_panel/action_panel';
 import Form from './form';
 
-import PieceListActions from '../../actions/piece_list_actions';
+import NotificationActions from '../../actions/notification_actions';
 
 import GlobalNotificationModel from '../../models/global_notification_model';
 import GlobalNotificationActions from '../../actions/global_notification_actions';
@@ -79,7 +79,14 @@ let RequestActionForm = React.createClass({
     },
 
     handleSuccess() {
-        PieceListActions.fetchPieceRequestActions();
+        if (this.isPiece()){
+            NotificationActions.fetchPieceListNotifications();
+            //NotificationActions.fetchPieceNotifications(this.props.pieceOrEditions.id);
+        }
+        else {
+            NotificationActions.fetchEditionListNotifications();
+            NotificationActions.fetchEditionNotifications(this.props.pieceOrEditions[0].bitcoin_id);
+        }
         if(this.props.handleSuccess) {
             this.props.handleSuccess();
         }

js/components/whitelabel/prize/components/ascribe_detail/prize_piece_container.js

@@ -15,6 +15,9 @@ import PieceListActions from '../../../../../actions/piece_list_actions';
 import PrizeRatingActions from '../../actions/prize_rating_actions';
 import PrizeRatingStore from '../../stores/prize_rating_store';
 
+import NotificationStore from '../../../../../stores/notification_store';
+import NotificationActions from '../../../../../actions/notification_actions.js';
+
 import UserStore from '../../../../../stores/user_store';
 
 import Piece from '../../../../../components/ascribe_detail/piece';
@@ -50,7 +53,8 @@ let PieceContainer = React.createClass({
     getInitialState() {
         return mergeOptions(
             PieceStore.getState(),
-            UserStore.getState()
+            UserStore.getState(),
+            NotificationStore.getState()
         );
     },
 
@@ -58,6 +62,8 @@ let PieceContainer = React.createClass({
         PieceStore.listen(this.onChange);
         PieceActions.fetchOne(this.props.params.pieceId);
         UserStore.listen(this.onChange);
+        NotificationStore.listen(this.onChange);
+        NotificationActions.fetchPieceNotifications(this.props.params.pieceId);
     },
 
     // This is done to update the container when the user clicks on the prev or next
@@ -77,6 +83,7 @@ let PieceContainer = React.createClass({
         PieceActions.updatePiece({});
         PieceStore.unlisten(this.onChange);
         UserStore.unlisten(this.onChange);
+        NotificationStore.unlisten(this.onChange);
     },
 
 
@@ -88,6 +95,19 @@ let PieceContainer = React.createClass({
         PieceActions.fetchOne(this.props.params.pieceId);
     },
 
+    getActions() {
+        if (this.state.piece &&
+            this.state.pieceNotifications &&
+            this.state.pieceNotifications.notification) {
+            return (
+                <ListRequestActions
+                    pieceOrEditions={this.state.piece}
+                    currentUser={this.state.currentUser}
+                    handleSuccess={this.loadPiece}
+                    requestActions={this.state.pieceNotifications.notification}/>);
+        }
+    },
+
     render() {
         if('title' in this.state.piece) {
             // Only show the artist name if you are the participant or if you are a judge and the piece is shortlisted
@@ -111,11 +131,7 @@ let PieceContainer = React.createClass({
                             <DetailProperty label={getLangText('BY')} value={artistName} />
                             <DetailProperty label={getLangText('DATE')} value={ this.state.piece.date_created.slice(0, 4) } />
                             {artistEmail}
-                            <ListRequestActions
+                            {this.getActions()}
-                                pieceOrEditions={this.state.piece}
-                                currentUser={this.state.currentUser}
-                                handleSuccess={this.loadPiece}
-                                requestActions={this.state.piece.request_action}/>
                             <hr/>
                         </div>
                         }

js/components/whitelabel/wallet/components/ikonotv/ascribe_detail/ikonotv_piece_container.js

@@ -10,6 +10,9 @@ import PieceListStore from '../../../../../../stores/piece_list_store';
 
 import UserStore from '../../../../../../stores/user_store';
 
+import NotificationStore from '../../../../../../stores/notification_store';
+import NotificationActions from '../../../../../../actions/notification_actions.js';
+
 import Piece from '../../../../../../components/ascribe_detail/piece';
 
 import ListRequestActions from '../../../../../ascribe_forms/list_form_request_actions';
@@ -41,7 +44,8 @@ let IkonotvPieceContainer = React.createClass({
         return mergeOptions(
             PieceStore.getState(),
             UserStore.getState(),
-            PieceListStore.getState()
+            PieceListStore.getState(),
+            NotificationStore.getState()
         );
     },
 
@@ -50,6 +54,8 @@ let IkonotvPieceContainer = React.createClass({
         PieceActions.fetchOne(this.props.params.pieceId);
         UserStore.listen(this.onChange);
         PieceListStore.listen(this.onChange);
+        NotificationStore.listen(this.onChange);
+        NotificationActions.fetchPieceNotifications(this.props.params.pieceId);
     },
 
     componentWillReceiveProps(nextProps) {
@@ -68,6 +74,7 @@ let IkonotvPieceContainer = React.createClass({
         PieceStore.unlisten(this.onChange);
         UserStore.unlisten(this.onChange);
         PieceListStore.unlisten(this.onChange);
+        NotificationStore.unlisten(this.onChange);
     },
 
     onChange(state) {
@@ -89,15 +96,14 @@ let IkonotvPieceContainer = React.createClass({
 
     getActions(){
         if (this.state.piece &&
-            this.state.piece.request_action &&
+            this.state.pieceNotifications &&
-            this.state.piece.request_action.length > 0) {
+            this.state.pieceNotifications.notification) {
             return (
                 <ListRequestActions
                     pieceOrEditions={this.state.piece}
                     currentUser={this.state.currentUser}
                     handleSuccess={this.loadPiece}
-                    requestActions={this.state.piece.request_action}/>
+                    requestActions={this.state.pieceNotifications.notification}/>);
-                );
         }
         else {
 

js/constants/api_urls.js

@@ -28,7 +28,9 @@ let ApiUrls = {
     'note_public_edition': AppConstants.apiEndpoint + 'note/public/editions/',
     'note_public_piece': AppConstants.apiEndpoint + 'note/public/pieces/',
     'notification_piecelist': AppConstants.apiEndpoint + 'notifications/pieces/',
+    'notification_piece': AppConstants.apiEndpoint + 'notifications/pieces/${piece_id}/',
     'notification_editionlist': AppConstants.apiEndpoint + 'notifications/editions/',
+    'notification_edition': AppConstants.apiEndpoint + 'notifications/editions/${edition_id}/',
     'ownership_contract_agreements': AppConstants.apiEndpoint + 'ownership/contract_agreements/',
     'ownership_consigns': AppConstants.apiEndpoint + 'ownership/consigns/',
     'ownership_consigns_confirm': AppConstants.apiEndpoint + 'ownership/consigns/confirm/',

js/fetchers/notification_fetcher.js

@@ -9,8 +9,16 @@ let NotificationFetcher = {
         return requests.get('notification_piecelist');
     },
 
+    fetchPieceNotifications(pieceId) {
+        return requests.get('notification_piece', {'piece_id': pieceId});
+    },
+
     fetchEditionListNotifications() {
         return requests.get('notification_editionlist');
+    },
+    
+    fetchEditionNotifications(editionId) {
+        return requests.get('notification_edition', {'edition_id': editionId});
     }
 };
 

js/stores/notification_store.js

@@ -10,6 +10,8 @@ class NotificationStore {
     constructor() {
         this.pieceListNotifications = {};
         this.editionListNotifications = {};
+        this.editionNotifications = null;
+        this.pieceNotifications = null;
         this.bindActions(NotificationActions);
     }
 
@@ -17,10 +19,18 @@ class NotificationStore {
         this.pieceListNotifications = res.notifications;
     }
 
+    onUpdatePieceNotifications(res) {
+        this.pieceNotifications = res.notification;
+    }
+
     onUpdateEditionListNotifications(res) {
         this.editionListNotifications = res.notifications;
     }
 
+    onUpdateEditionNotifications(res) {
+        this.editionNotifications = res.notification;
+    }
+
 }
 
 export default alt.createStore(NotificationStore, 'NotificationStore');

sass/ascribe_notification_list.scss

@@ -61,8 +61,8 @@ $break-medium: 1200px;
             padding-top: 0;
         }
         border-top: 0;
-        overflow-y:auto;
+        overflow-y: auto;
-        overflow-x:hidden;
+        overflow-x: hidden;
         max-height: 70vh;
     }
 }