From bc28f3d8f5d7bbd7c0c19cfc86dd6e06a9a60c69 Mon Sep 17 00:00:00 2001
From: diminator <dimi.dejonghe@gmail.com>
Date: Thu, 27 Aug 2015 13:43:26 +0200
Subject: [PATCH] loan request actions for multiple actions

---
 .../accordion_list_item.js                    |  2 +-
 .../accordion_list_item_wallet.js             |  4 +-
 js/components/ascribe_detail/edition.js       | 11 +++--
 .../ascribe_detail/piece_container.js         | 12 +++---
 .../ascribe_forms/form_loan_request_answer.js |  7 ----
 .../ascribe_forms/form_request_action.js      |  7 +++-
 .../list_form_request_actions.js              | 37 ++++++++++++++++
 .../ascribe_table/table_item_acl_filtered.js  |  4 +-
 .../ascribe_detail/prize_piece_container.js   | 42 ++++++++-----------
 sass/ascribe_accordion_list.scss              |  4 +-
 sass/whitelabel/prize/rating.scss             |  2 +-
 11 files changed, 78 insertions(+), 54 deletions(-)
 create mode 100644 js/components/ascribe_forms/list_form_request_actions.js

diff --git a/js/components/ascribe_accordion_list/accordion_list_item.js b/js/components/ascribe_accordion_list/accordion_list_item.js
index 37803ad2..6204f57d 100644
--- a/js/components/ascribe_accordion_list/accordion_list_item.js
+++ b/js/components/ascribe_accordion_list/accordion_list_item.js
@@ -39,7 +39,7 @@ let AccordionListItem = React.createClass({
                         </div>
                         <span style={{'clear': 'both'}}></span>
 
-                        <div className="request-action-batch">
+                        <div className="request-action-badge">
                             {this.props.badge}
                         </div>
                     </div>
diff --git a/js/components/ascribe_accordion_list/accordion_list_item_wallet.js b/js/components/ascribe_accordion_list/accordion_list_item_wallet.js
index 3cb557ef..f7bca334 100644
--- a/js/components/ascribe_accordion_list/accordion_list_item_wallet.js
+++ b/js/components/ascribe_accordion_list/accordion_list_item_wallet.js
@@ -61,13 +61,13 @@ let AccordionListItemWallet = React.createClass({
     },
 
     getGlyphicon(){
-        if (this.props.content.requestAction) {
+        if (this.props.content.requestAction && this.props.content.requestAction.length > 0) {
             return (
                 <OverlayTrigger
                     delay={500}
                     placement="left"
                     overlay={<Tooltip>{getLangText('You have actions pending in one of your editions')}</Tooltip>}>
-                    <Glyphicon glyph='bell'/>
+                    <Glyphicon glyph='bell' color="green"/>
                 </OverlayTrigger>);
         }
         return null;
diff --git a/js/components/ascribe_detail/edition.js b/js/components/ascribe_detail/edition.js
index 4f4d424c..696e5057 100644
--- a/js/components/ascribe_detail/edition.js
+++ b/js/components/ascribe_detail/edition.js
@@ -28,7 +28,7 @@ import EditionDetailProperty from './detail_property';
 
 import EditionFurtherDetails from './further_details';
 
-import RequestActionForm from './../ascribe_forms/form_request_action';
+import ListRequestActions from './../ascribe_forms/list_form_request_actions';
 import AclButtonList from './../ascribe_buttons/acl_button_list';
 import UnConsignRequestButton from './../ascribe_buttons/unconsign_request_button';
 import DeleteButton from '../ascribe_buttons/delete_button';
@@ -236,12 +236,11 @@ let EditionSummary = React.createClass({
         let actions = null;
         if (this.props.edition.request_action && this.props.edition.request_action.length > 0){
             actions = (
-                <RequestActionForm
+                <ListRequestActions
+                    pieceOrEditions={[this.props.edition]}
                     currentUser={this.props.currentUser}
-                    pieceOrEditions={ [this.props.edition] }
-                    requestAction={this.props.edition.request_action}
-                    requestUser={this.props.edition.owner}
-                    handleSuccess={this.showNotification}/>);
+                    handleSuccess={this.showNotification}
+                    requestActions={this.props.edition.request_action}/>);
         }
 
         else {
diff --git a/js/components/ascribe_detail/piece_container.js b/js/components/ascribe_detail/piece_container.js
index 22986b53..3739a508 100644
--- a/js/components/ascribe_detail/piece_container.js
+++ b/js/components/ascribe_detail/piece_container.js
@@ -26,7 +26,7 @@ import CreateEditionsForm from '../ascribe_forms/create_editions_form';
 import CreateEditionsButton from '../ascribe_buttons/create_editions_button';
 import DeleteButton from '../ascribe_buttons/delete_button';
 
-import RequestActionForm from '../ascribe_forms/form_request_action';
+import ListRequestActions from '../ascribe_forms/list_form_request_actions';
 
 import GlobalNotificationModel from '../../models/global_notification_model';
 import GlobalNotificationActions from '../../actions/global_notification_actions';
@@ -175,12 +175,12 @@ let PieceContainer = React.createClass({
             this.state.piece.request_action &&
             this.state.piece.request_action.length > 0) {
             return (
-                <RequestActionForm
+                <ListRequestActions
+                    pieceOrEditions={this.state.piece}
                     currentUser={this.state.currentUser}
-                    pieceOrEditions={ this.state.piece }
-                    requestAction={this.state.piece.request_action}
-                    requestUser={this.state.piece.user_registered}
-                    handleSuccess={this.loadPiece}/>);
+                    handleSuccess={this.loadPiece}
+                    requestActions={this.state.piece.request_action}/>
+                );
         }
         else {
             return (
diff --git a/js/components/ascribe_forms/form_loan_request_answer.js b/js/components/ascribe_forms/form_loan_request_answer.js
index bfacd74b..2ebdb439 100644
--- a/js/components/ascribe_forms/form_loan_request_answer.js
+++ b/js/components/ascribe_forms/form_loan_request_answer.js
@@ -2,15 +2,8 @@
 
 import React from 'react';
 import Moment from 'moment';
-import classnames from 'classnames';
-
-import Button from 'react-bootstrap/lib/Button';
 
 import LoanForm from './form_loan';
-import Property from './property';
-import InputTextAreaToggable from './input_textarea_toggable';
-import InputDate from './input_date';
-import InputCheckbox from './input_checkbox';
 
 import OwnershipActions from '../../actions/ownership_actions';
 import OwnershipStore from '../../stores/ownership_store';
diff --git a/js/components/ascribe_forms/form_request_action.js b/js/components/ascribe_forms/form_request_action.js
index bd76c3b8..5ca7db6c 100644
--- a/js/components/ascribe_forms/form_request_action.js
+++ b/js/components/ascribe_forms/form_request_action.js
@@ -78,8 +78,11 @@ let RequestActionForm = React.createClass({
     },
 
     getContent() {
-        let message = this.props.requestUser + ' ' + getLangText('requests you') + ' ' + this.props.requestAction + ' ' + getLangText('this edition%s', '.');
-
+        let pieceOrEditionStr = this.isPiece() ? getLangText('this work%s', '.') : getLangText('this edition%s', '.');
+        let message = this.props.requestUser + ' ' + getLangText('requests you') + ' ' + this.props.requestAction + ' ' + pieceOrEditionStr;
+        if (this.props.requestAction === 'loan_request'){
+            message = this.props.requestUser + ' ' + getLangText('requests you to loan') + ' ' + pieceOrEditionStr;
+        }
         return (
             <span>
                 {message}
diff --git a/js/components/ascribe_forms/list_form_request_actions.js b/js/components/ascribe_forms/list_form_request_actions.js
new file mode 100644
index 00000000..429a4944
--- /dev/null
+++ b/js/components/ascribe_forms/list_form_request_actions.js
@@ -0,0 +1,37 @@
+'use strict';
+
+import React from 'react';
+import RequestActionForm from './form_request_action';
+
+let ListRequestActions = React.createClass({
+
+    propTypes: {
+        pieceOrEditions: React.PropTypes.oneOfType([
+            React.PropTypes.object,
+            React.PropTypes.array
+        ]).isRequired,
+        currentUser: React.PropTypes.object.isRequired,
+        handleSuccess: React.PropTypes.func.isRequired,
+        requestActions: React.PropTypes.array.isRequired
+    },
+
+    render () {
+        if (this.props.requestActions &&
+            this.props.requestActions.length > 0) {
+            return (
+                <div>
+                    {this.props.requestActions.map((requestAction) =>
+                        <RequestActionForm
+                            currentUser={this.props.currentUser}
+                            pieceOrEditions={ this.props.pieceOrEditions }
+                            requestAction={requestAction.action}
+                            requestUser={requestAction.by}
+                            handleSuccess={this.props.handleSuccess}/>)}
+                </div>
+            );
+        }
+        return null;
+    }
+});
+
+export default ListRequestActions;
\ No newline at end of file
diff --git a/js/components/ascribe_table/table_item_acl_filtered.js b/js/components/ascribe_table/table_item_acl_filtered.js
index 9a684e36..c850ab59 100644
--- a/js/components/ascribe_table/table_item_acl_filtered.js
+++ b/js/components/ascribe_table/table_item_acl_filtered.js
@@ -11,10 +11,10 @@ let TableItemAclFiltered = React.createClass({
 
     render() {
         var availableAcls = ['acl_consign', 'acl_loan', 'acl_transfer', 'acl_view', 'acl_share', 'acl_unshare', 'acl_delete'];
-        if (this.props.requestAction){
+        if (this.props.requestAction && this.props.requestAction.length > 0){
             return (
                 <span>
-                    {this.props.requestAction + ' request pending'}
+                    {this.props.requestAction[0].action + ' request pending'}
                 </span>
             );
         }
diff --git a/js/components/whitelabel/prize/components/ascribe_detail/prize_piece_container.js b/js/components/whitelabel/prize/components/ascribe_detail/prize_piece_container.js
index b1a85ef8..4b785fc2 100644
--- a/js/components/whitelabel/prize/components/ascribe_detail/prize_piece_container.js
+++ b/js/components/whitelabel/prize/components/ascribe_detail/prize_piece_container.js
@@ -29,7 +29,7 @@ import CollapsibleParagraph from '../../../../../components/ascribe_collapsible/
 
 import InputCheckbox from '../../../../ascribe_forms/input_checkbox';
 import LoanForm from '../../../../ascribe_forms/form_loan';
-import RequestActionForm from '../../../../ascribe_forms/form_request_action';
+import ListRequestActions from '../../../../ascribe_forms/list_form_request_actions';
 import ModalWrapper from '../../../../ascribe_modal/modal_wrapper';
 
 import GlobalNotificationModel from '../../../../../models/global_notification_model';
@@ -89,21 +89,6 @@ let PieceContainer = React.createClass({
         this.setState(this.state);
     },
 
-    getActions(){
-        if (this.state.piece &&
-            this.state.piece.request_action &&
-            this.state.piece.request_action.length > 0) {
-            return (
-                <RequestActionForm
-                    currentUser={this.state.currentUser}
-                    pieceOrEditions={ this.state.piece }
-                    requestAction={this.state.piece.request_action}
-                    requestUser={this.state.piece.user_registered}
-                    handleSuccess={this.loadPiece}/>);
-        }
-        return null;
-    },
-
     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
@@ -112,7 +97,7 @@ let PieceContainer = React.createClass({
                 <span className="glyphicon glyphicon-eye-close" aria-hidden="true"/> : this.state.piece.artist_name;
             // Only show the artist email if you are a judge and the piece is shortlisted
             let artistEmail = (this.state.currentUser.is_judge && this.state.piece.selected ) ?
-                <DetailProperty label="REGISTREE" value={ this.state.piece.user_registered } /> : null;
+                <DetailProperty label={getLangText('REGISTREE')} value={ this.state.piece.user_registered } /> : null;
             return (
                 <Piece
                     piece={this.state.piece}
@@ -124,10 +109,14 @@ let PieceContainer = React.createClass({
                                 currentUser={this.state.currentUser}/>
                             <hr/>
                             <h1 className="ascribe-detail-title">{this.state.piece.title}</h1>
-                            <DetailProperty label="BY" value={artistName} />
-                            <DetailProperty label="DATE" value={ this.state.piece.date_created.slice(0, 4) } />
+                            <DetailProperty label={getLangText('BY')} value={artistName} />
+                            <DetailProperty label={getLangText('DATE')} value={ this.state.piece.date_created.slice(0, 4) } />
                             {artistEmail}
-                            {this.getActions()}
+                            <ListRequestActions
+                                pieceOrEditions={this.state.piece}
+                                currentUser={this.state.currentUser}
+                                handleSuccess={this.loadPiece}
+                                requestActions={this.state.piece.request_action}/>
                             <hr/>
                         </div>
                         }
@@ -237,6 +226,11 @@ let PrizePieceRatings = React.createClass({
         );
     },
 
+    handleLoanRequestSuccess(message){
+        let notification = new GlobalNotificationModel(message, 'success', 4000);
+        GlobalNotificationActions.appendGlobalNotification(notification);
+    },
+
     getLoanButton(){
         let today = new Moment();
         let endDate = new Moment();
@@ -245,15 +239,15 @@ let PrizePieceRatings = React.createClass({
             <ModalWrapper
                 trigger={
                     <button className='btn btn-default btn-sm'>
-                        SEND LOAN REQUEST
+                        {getLangText('SEND LOAN REQUEST')}
                     </button>
                 }
                 handleSuccess={this.handleLoanRequestSuccess}
                 title='REQUEST LOAN'>
                     <LoanForm
                         loanHeading={null}
-                        message={'Congratulations,\nYou have been selected for the sluice screens.\n' +
-                         'Please accept the loan request to proceed\n\nBest regards,\n\nSluice.'}
+                        message={getLangText('Congratulations,\nYou have been selected for the prize.\n' +
+                         'Please accept the loan request to proceed.')}
                         id={{piece_id: this.props.piece.id}}
                         url={ApiUrls.ownership_loans_pieces_request}
                         email={this.props.currentUser.email}
@@ -266,8 +260,6 @@ let PrizePieceRatings = React.createClass({
             </ModalWrapper>);
     },
 
-    handleLoanRequestSuccess(){},
-
     handleShortlistSuccess(message){
         let notification = new GlobalNotificationModel(message, 'success', 2000);
         GlobalNotificationActions.appendGlobalNotification(notification);
diff --git a/sass/ascribe_accordion_list.scss b/sass/ascribe_accordion_list.scss
index b040e877..1ef4bef9 100644
--- a/sass/ascribe_accordion_list.scss
+++ b/sass/ascribe_accordion_list.scss
@@ -152,11 +152,11 @@ span.ascribe-accordion-list-table-toggle {
     }
 }
 
-.request-action-batch {
+.request-action-badge {
     position: absolute;
     top: 0px;
     right: 0px;
-    color: #666;
+    color: $ascribe-color-green;
     font-size: 1.2em;
     padding: 0.3em;
 }
diff --git a/sass/whitelabel/prize/rating.scss b/sass/whitelabel/prize/rating.scss
index 8ea7c8ba..dfbff05b 100644
--- a/sass/whitelabel/prize/rating.scss
+++ b/sass/whitelabel/prize/rating.scss
@@ -29,6 +29,6 @@
 .rating-note {
     color: #666;
     font-style: italic;
-    padding: 0.2em;
+    padding: 0.7em;
 
 }
\ No newline at end of file