import React from 'react';
import {bindActionCreators} from 'redux';
import {connect} from 'react-redux';
import Transaction from '../transaction';
import * as transactionsActionCreators from '../../../redux/transactions/action-creators';

function getTransactionsList(transactions, transactionsActions) {
  return transactions.map(t => (
    <Transaction
      key={t.id}
      transaction={t}
      deleteTransaction={transactionsActions.deleteTransaction}
      updateTransaction={transactionsActions.updateTransaction}/>
  ));
}

function getEmptyTransactions() {
  return (<div>There are no transactions.</div>);
}

export function Transactions({transactions, transactionsActions}) {
  var children;

  if (transactions && transactions.length) {
    children = getTransactionsList(transactions, transactionsActions);
  } else {
    children = getEmptyTransactions();
  }

  return (
    <ul className="transactions">
      {children}
    </ul>
  );
}

function mapStateToProps(state) {
  return {
    transactions: state.transactions.transactions
  };
}

function mapDispatchToProps(dispatch) {
  return {
    transactionsActions: bindActionCreators(transactionsActionCreators, dispatch)
  };
}

export default connect(mapStateToProps, mapDispatchToProps)(Transactions);

@@ -523,24 +523,101 @@
 /%3E%0A  ));%0A%7D%0A%0A
+function getLoadingState() %7B%0A  return (%3Cdiv%3ELoading transactions.%3C/div%3E);%0A%7D%0A%0A
 function get
@@ -702,30 +702,196 @@
 ort 
-function Transactions(
+const Transactions = React.createClass(%7B%0A  componentDidMount() %7B%0A    const %7BtransactionsActions%7D = this.props;%0A    transactionsActions.retrieveTransactions();%0A  %7D,%0A%0A  render() %7B%0A    const 
 %7Btra
@@ -921,20 +921,33 @@
 Actions%7D
-) %7B%0A
+ = this.props;%0A  
   var ch
@@ -961,12 +961,15 @@
 %0A%0A  
+ 
+ 
 if (
+!
 tran
@@ -980,12 +980,64 @@
 ions
- && 
+) %7B%0A      children = getLoadingState();%0A    %7D else if (!
 tran
@@ -1055,24 +1055,26 @@
 ngth) %7B%0A    
+ 
+ 
 children = g
@@ -1071,24 +1071,29 @@
 ildren = get
+Empty
 Transactions
@@ -1096,49 +1096,14 @@
 ions
-List(transactions, transactionsActions
+(
 );%0A
+  
   %7D 
@@ -1109,16 +1109,18 @@
  else %7B%0A
+  
     chil
@@ -1121,37 +1121,32 @@
   children = get
-Empty
 Transactions();%0A
@@ -1145,17 +1145,58 @@
 ions
-(
+List(transactions, transactionsActions
 );%0A
+  
   %7D%0A%0A
+  
   re
@@ -1206,16 +1206,18 @@
 n (%0A    
+ 
+ 
 %3Cul clas
@@ -1244,16 +1244,18 @@
 %3E%0A      
+  
 %7Bchildre
@@ -1265,20 +1265,30 @@
     
+  
 %3C/ul%3E%0A
+  
   );%0A
-%7D
+  %7D%0A%7D);
 %0A%0Afu

Add loading state to transactions list