import React, { Component } from 'react'
import nodemailer from 'nodemailer';

export default class QuoteForm extends Component {
  constructor() {
    super()

      this.state = {
        fullname:"",
        email:"",
        desc:""
      }

  }

  onSubmit() {

    let transporter = nodemailer.createTransport({
      host: "mail.hulun.co",
      port: 465,
      secure: true,
      auth: {
        user: "contact@hulun.co",
        pass: "C^u*@]UQE8L}"
      }
    });

  let mailOptions = {
    from: `"${this.state.fullname}" <${this.state.email}>`, // sender address
    to: "contact@hulun.co", // list of receivers
    subject: "Requesting Quote (Sent from Website)", // Subject line
    text: "Hello world?", // plain text body
    html: "<b>Hello world?</b>" // html body
  };

  transporter.sendMail(mailOptions, (error, info) => {
      if (error) {
          return console.log(error);
      }
      return;
  });

  }
  render() {
    return (
      <form className="quote-form" action="quote-thank-you" onSubmit={this.onSubmit}>
        <h2>Personal Details <span>(Required Fields)</span></h2>
        <hr/>
        <input value={this.state.fullname} onChange={e => { this.setState({fullname: e.target.value})}} required placeholder="Enter Full Name"/>
        <input value={this.state.email} onChange={e => { this.setState({email: e.target.value})}} type="email" required placeholder="Enter Email-address"/>
        <h2>Project Details</h2>
        <hr/>
        <textarea value={this.state.desc} onChange={e => { this.setState({desc: e.target.value})}} placeholder="Enter Project Details"></textarea>
        <br/>
        <button>Submit</button>

        <ul className="motto-signs">
            <li>
               <i className="fas fa-user-clock"/>
               <p>We respond within 3-5 business days.</p>
            </li>
            <li>
              <i className="fas fa-user-shield"/>
              <p>All info you submit is strictly confidential.</p>
            </li>
        </ul>


      </form>
    )
  }
}