import React, { Component } from 'react';
import Dialog from 'material-ui/Dialog';
import FlatButton from 'material-ui/FlatButton';
import Draggable, { DraggableCore } from 'react-draggable'; // Both at the same time

export class ValidationErrorsInfoDialog extends React.Component {

    state = {
      open: this.props.open,
    }
  
    componentWillReceiveProps(newProps){
      this.setState({open: newProps.open});
    }
  
    handleOpen = () => {
      this.setState({ open: true });
    };
  
    handleClose = () => {
      this.setState({ open: false });
      this.props.onDismiss();
    };
  
    render() {
  
      const actions = [
        <FlatButton
          label="Dismiss"
          primary={true}
          keyboardFocused={true}
          onClick={this.handleClose}
        />,
      ];
  
      return (
        <div>
          <Dialog
            title="Erors"
            actions={actions}
            modal={this.props.modal ? this.props.modal : false}
            open={this.state.open}
            onRequestClose={this.handleClose}
            overlayStyle={{backgroundColor: 'transparent'}}
          >
            {this.props.errorMessages.map(errorMessage => {
              return (
                <div>
                  <a>{errorMessage.message}</a>
                  <br/>
                </div>
              );
            })}
          </Dialog>
        </div>
      );
    }
  }

  module.exports = ValidationErrorsInfoDialog;