From 2c1ad6dc464fdc34d5496fe9f8ac33c5119b2289 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tim=20Daubensch=C3=BCtz?= <tim@ascribe.io>
Date: Tue, 8 Sep 2015 11:19:11 +0200
Subject: [PATCH] fix bug in contract settings and expand actionpanel
 functionality

---
 .../ascribe_forms/form_create_contract.js     | 12 ++--
 .../ascribe_settings/contract_settings.js     | 64 +++++++++++--------
 sass/ascribe_collapsible.scss                 |  2 +-
 3 files changed, 45 insertions(+), 33 deletions(-)

diff --git a/js/components/ascribe_forms/form_create_contract.js b/js/components/ascribe_forms/form_create_contract.js
index 55a94511..488a2153 100644
--- a/js/components/ascribe_forms/form_create_contract.js
+++ b/js/components/ascribe_forms/form_create_contract.js
@@ -9,6 +9,8 @@ import InputCheckbox from '../ascribe_forms/input_checkbox';
 import GlobalNotificationModel from '../../models/global_notification_model';
 import GlobalNotificationActions from '../../actions/global_notification_actions';
 
+import ContractListActions from '../../actions/contract_list_actions';
+
 import ReactS3FineUploader from '../ascribe_uploader/react_s3_fine_uploader';
 
 import AppConstants from '../../constants/application_constants';
@@ -48,6 +50,9 @@ let CreateContractForm = React.createClass({
     handleCreateSuccess(response) {
         let notification = new GlobalNotificationModel(getLangText('Contract %s successfully created', response.name), 'success', 5000);
         GlobalNotificationActions.appendGlobalNotification(notification);
+
+        // also refresh contract lists for the rest of the contract settings page
+        ContractListActions.fetchContractList();
     },
 
 
@@ -109,7 +114,7 @@ let CreateContractForm = React.createClass({
                     label={getLangText('Contract name')}>
                     <input
                         type="text"
-                        placeholder="(e.g. Loan agreement #1)"
+                        placeholder="(e.g. Contract - Loan agreement #1)"
                         required/>
                 </Property>
                 <Property
@@ -118,10 +123,7 @@ let CreateContractForm = React.createClass({
                     style={{paddingBottom: 0}}>
                     <InputCheckbox>
                         <span>
-                            {' ' + getLangText('I agree to the Terms of Service') + ' '}
-                            (<a href="https://www.ascribe.io/terms" target="_blank" style={{fontSize: '0.9em', color: 'rgba(0,0,0,0.7)'}}>
-                                {getLangText('read')}
-                            </a>)
+                            Make contract public (this will replace the current public contract)
                         </span>
                     </InputCheckbox>
                 </Property>
diff --git a/js/components/ascribe_settings/contract_settings.js b/js/components/ascribe_settings/contract_settings.js
index 72d2b233..e34772f2 100644
--- a/js/components/ascribe_settings/contract_settings.js
+++ b/js/components/ascribe_settings/contract_settings.js
@@ -10,54 +10,63 @@ import ContractListActions from '../../actions/contract_list_actions';
 
 import ActionPanel from '../ascribe_panel/action_panel';
 
-import { getLangText } from '../../utils/lang_utils';
 import GlobalNotificationModel from '../../models/global_notification_model';
 import GlobalNotificationActions from '../../actions/global_notification_actions';
 
+import { getLangText } from '../../utils/lang_utils';
+
 let ContractSettings = React.createClass({
     propTypes: {
         defaultExpanded: React.PropTypes.bool
     },
+
     getInitialState(){
         return ContractListStore.getState();
     },
+
     componentDidMount() {
         ContractListStore.listen(this.onChange);
         ContractListActions.fetchContractList();
     },
+
     componentWillUnmount() {
         ContractListStore.unlisten(this.onChange);
     },
+
     onChange(state) {
         this.setState(state);
     },
-    makeContractPublic(contract){
-        ContractListActions.makeContractPublic(contract)
-            .then(( ) => ContractListActions.fetchContractList())
-            .catch((error)=>{
-                let notification = new GlobalNotificationModel(error, 'danger', 10000);
-                GlobalNotificationActions.appendGlobalNotification(notification);
-        });
+
+    makeContractPublic(contract) {
+        return () => {
+            ContractListActions.makeContractPublic(contract)
+                .then(() => ContractListActions.fetchContractList())
+                .catch((error) => {
+                    let notification = new GlobalNotificationModel(error, 'success', 10000);
+                    GlobalNotificationActions.appendGlobalNotification(notification);
+            });
+        };
     },
-    removeContract(contract){
-        console.log(contract);
-        ContractListActions.removeContract(contract.id)
-            .then(( ) => ContractListActions.fetchContractList())
-            .catch((error) => {
-                console.log('Error', error);
-                let notification = new GlobalNotificationModel(error, 'danger', 10000);
-                GlobalNotificationActions.appendGlobalNotification(notification);
-        });
+
+    removeContract(contract) {
+        return () => {
+            ContractListActions.removeContract(contract.id)
+                .then(( ) => ContractListActions.fetchContractList())
+                .catch((error) => {
+                    let notification = new GlobalNotificationModel(error, 'danger', 10000);
+                    GlobalNotificationActions.appendGlobalNotification(notification);
+            });
+        };
     },
+
     getPublicContracts(){
         return this.state.contractList.filter((contract) => contract.public);
     },
+
     getPrivateContracts(){
         return this.state.contractList.filter((contract) => !contract.public);
     },
-    getblobEndName(contract){
-        return contract.blob.match(/.*\/(.*)/)[1];
-    },
+
     render() {
         let publicContracts = this.getPublicContracts();
         let privateContracts = this.getPrivateContracts();
@@ -75,9 +84,10 @@ let ContractSettings = React.createClass({
                         title={getLangText('Public Contracts')}
                         show={true}
                         defaultExpanded={true}>
-                        {publicContracts.map((contract) => {
+                        {publicContracts.map((contract, i) => {
                             return (
                                 <ActionPanel
+                                    key={i}
                                     title={contract.name}
                                     content={contract.name}
                                     buttons={
@@ -86,14 +96,13 @@ let ContractSettings = React.createClass({
                                                 UPDATE
                                            </button>
                                            <button className="btn btn-default btn-sm margin-left-2px"
-                                            onClick={this.removeContract.bind(this, contract)}>
+                                            onClick={this.removeContract(contract)}>
                                                 REMOVE
                                             </button>
                                        </div>
                                     }
                                     leftColumnWidth="40%"
-                                    rightColumnWidth="60%"
-                                />
+                                    rightColumnWidth="60%"/>
                             );
                         })}
                     </CollapsibleParagraph>
@@ -101,9 +110,10 @@ let ContractSettings = React.createClass({
                         title={getLangText('Private Contracts')}
                         show={true}
                         defaultExpanded={true}>
-                        {privateContracts.map((contract) => {
+                        {privateContracts.map((contract, i) => {
                             return (
                                 <ActionPanel
+                                    key={i}
                                     title={contract.name}
                                     content={contract.name}
                                     buttons={
@@ -112,11 +122,11 @@ let ContractSettings = React.createClass({
                                                 UPDATE
                                             </button>
                                             <button className="btn btn-default btn-sm margin-left-2px"
-                                            onClick={this.removeContract.bind(this, contract)}>
+                                            onClick={this.removeContract(contract)}>
                                                 REMOVE
                                             </button>
                                             <button className="btn btn-default btn-sm margin-left-2px"
-                                            onClick={this.makeContractPublic.bind(this, contract)}>
+                                            onClick={this.makeContractPublic(contract)}>
                                                 MAKE PUBLIC
                                             </button>
                                        </div>
diff --git a/sass/ascribe_collapsible.scss b/sass/ascribe_collapsible.scss
index 85fd4270..2b65567c 100644
--- a/sass/ascribe_collapsible.scss
+++ b/sass/ascribe_collapsible.scss
@@ -28,6 +28,6 @@
     /* Shrink the size of the headline for a nested element */
     .ascribe-collapsible-wrapper > .ascribe-collapsible-content {
         padding-left: 1em;
-        font-size: 90%;
+        font-size: 95%;
     }
 }
\ No newline at end of file