import React, {Component} from 'react'
import PropTypes from 'prop-types'
import {Button, Modal} from 'react-bootstrap'
import NewOrderForm from './NewOrderForm'
import CreateOrderResultModal from "./CreateOrderResultModal"

class NewOrderButton extends Component {

    constructor(props) {
        super(props)
        this.state = {
            showCreateModal: false,
            showResultModal: false,
            createOrderProgress: 'idle'
        }

        this.onCreateOrder = this.onCreateOrder.bind(this)
        this.openCreateModal = this.openCreateModal.bind(this)
        this.closeCreateModal = this.closeCreateModal.bind(this)
        this.openResultModal = this.openResultModal.bind(this)
        this.closeResultModal = this.closeResultModal.bind(this)
    }

    onCreateOrder(order) {
        var self=this
        this.setState({createOrderProgress:'waitingTransaction'})
        this.props.factoryInstance.createStandingOrder(order.receiver, order.rate, order.period, order.startTime.unix(), order.label, {
            from: this.props.account,
            gas: 1000000
        }).then(function(result){
            console.log('Created StandingOrder - transaction: ' + result.tx)
            console.log(result.receipt)
            // check for log entries. If there are no logs created, contract creation failed!
            if(result.logs.length < 1) {
                throw new Error('Transaction completed, but no log entries -> Contract creation failed.')
            }
            self.setState({createOrderProgress:'done'})
            self.closeCreateModal()
        }).catch(function(e) {
            // There was an error! Handle it.
            console.log("Error while creating order. Message: " + e)
            self.setState({createOrderProgress:'idle'})
            self.closeCreateModal()
            self.openResultModal()
        })
    }

    closeCreateModal() {
        this.setState({showCreateModal: false})
    }

    openCreateModal() {
        this.setState(
            {
                showCreateModal: true,
                createOrderProgress:'idle'
            })
    }

    openResultModal() {
        this.setState({showResultModal: true})
    }

    closeResultModal() {
        this.setState({showResultModal: false})
    }


    render() {
        let button = <Button
            bsStyle="primary"
            onClick={this.openCreateModal}>
            {this.props.label}
        </Button>

        let createModal = <Modal show={this.state.showCreateModal} onHide={this.closeCreateModal}>
            <Modal.Header closeButton>
                <Modal.Title>Create standing order</Modal.Title>
            </Modal.Header>
            <Modal.Body>
                <NewOrderForm
                    onNewOrder={this.onCreateOrder}
                    onCancel={this.closeCreateModal}
                    createOrderProgress={this.state.createOrderProgress}
                />
            </Modal.Body>
        </Modal>

        let resultModal = <CreateOrderResultModal showModal={this.state.showResultModal} onClose={this.closeResultModal}/>

        return <div>
            {button}
            {createModal}
            {resultModal}
        </div>
    }
}

NewOrderButton.propTypes = {
    label: PropTypes.string.isRequired,
    account: PropTypes.string.isRequired,
    factoryInstance: PropTypes.any.isRequired, // TODO: Use specifc protype instead of 'any'!
}

export default NewOrderButton
@@ -166,56 +166,38 @@
 ort 
-CreateOrderResultModal from %22./CreateOrderResult
+FeedbackModal from %22./Feedback
 Moda
@@ -418,24 +418,57 @@
 ress: 'idle'
+,%0A            createErrorMsg: '',
 %0A        %7D%0A%0A
@@ -853,32 +853,45 @@
  this.setState(%7B
+%0A            
 createOrderProgr
@@ -914,16 +914,58 @@
 saction'
+,%0A            createErrorMsg: '',%0A        
 %7D)%0A     
@@ -1821,32 +1821,49 @@
  self.setState(%7B
+%0A                
 createOrderProgr
@@ -1872,16 +1872,75 @@
 s:'idle'
+,%0A                createErrorMsg: e.toString()%0A            
 %7D)%0A     
@@ -3138,45 +3138,335 @@
 let 
-resultModal = %3CCreateOrderResultModal
+title = %22Error occurred%22%0A        let body = %3Cdiv%3E%0A            %3Cp%3EAn error occured while creating order.%3C/p%3E%0A            %3Cp%3E%7Bthis.state.createErrorMsg%7D%3C/p%3E%0A            %3Cp%3ENo transactions have been performed.%3C/p%3E%0A        %3C/div%3E%0A        let errorModal = %3CFeedbackModal%0A            title=%7Btitle%7D%0A            body=%7Bbody%7D%0A           
  sho
@@ -3500,16 +3500,28 @@
 ltModal%7D
+%0A           
  onClose
@@ -3544,16 +3544,25 @@
 ltModal%7D
+%0A        
 /%3E%0A%0A    
@@ -3638,22 +3638,21 @@
        %7B
-result
+error
 Modal%7D%0A 

Use new FeedbackModal.