From 5b2cc29195141837130df1e7e9adea09d7e87a96 Mon Sep 17 00:00:00 2001
From: Ruidy Nemausat <ruidy.nemausat@gmail.com>
Date: Sun, 8 Mar 2020 13:03:55 +0100
Subject: [PATCH] nodemailer

---
 .gitignore                     |  3 ++-
 package-lock.json              |  2 +-
 package.json                   |  2 +-
 src/components/ContactForm.jsx | 27 ++++++++++++++-------
 src/pages/Contact.jsx          |  2 +-
 src/utils/mail.js              | 43 ++++++++++++++++++++++++++++++++++
 6 files changed, 67 insertions(+), 12 deletions(-)
 create mode 100644 src/utils/mail.js

diff --git a/.gitignore b/.gitignore
index 5fe43d8..fa43dd4 100644
--- a/.gitignore
+++ b/.gitignore
@@ -22,4 +22,5 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 
-# /src/utils/auth_config.json
\ No newline at end of file
+/src/utils/auth_config.json
+/src/utils/secret.js
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index c4e451e..b2fcfde 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -14215,4 +14215,4 @@
       }
     }
   }
-}
+}
\ No newline at end of file
diff --git a/package.json b/package.json
index 5b7fabf..800bd46 100644
--- a/package.json
+++ b/package.json
@@ -33,4 +33,4 @@
       "last 1 safari version"
     ]
   }
-}
+}
\ No newline at end of file
diff --git a/src/components/ContactForm.jsx b/src/components/ContactForm.jsx
index d04bf19..f52a47b 100644
--- a/src/components/ContactForm.jsx
+++ b/src/components/ContactForm.jsx
@@ -1,18 +1,13 @@
 import React, { useState } from "react";
-// import { useInput } from "../utils/inputHook";
+// import { notificationMail, confirmationMail } from "../utils/mail";
 
-export const ContactForm = ({ onSubmit }) => {
+export const ContactForm = ({ setIsSubmitted }) => {
   const [firstName, setFirstName] = useState("");
   const [lastName, setLastName] = useState("");
   const [email, setEmail] = useState("");
   const [phone, setPhone] = useState("");
   const [message, setMessage] = useState("");
 
-  const handleSubmit = ev => {
-    ev.preventDefault();
-    onSubmit(true);
-  };
-
   const changeFirstName = ev => {
     const { value } = ev.target;
     setFirstName(value);
@@ -34,6 +29,14 @@ export const ContactForm = ({ onSubmit }) => {
     setMessage(value);
   };
 
+  const handleSubmit = ev => {
+    ev.preventDefault();
+    // confirmationMail(email);
+    // const body = `Sender: ${firstName} ${lastName}\nPhone: ${phone}\nMessage: ${message}`;
+    // notificationMail(email, `New message from ${firstName} ${lastName}`, body);
+    setIsSubmitted(true);
+  };
+
   return (
     <form onSubmit={handleSubmit}>
       <div className="row">
@@ -61,7 +64,13 @@ export const ContactForm = ({ onSubmit }) => {
             />
           </div>
           <div className="col s12 m6">
-            <ContactFormInput id="Phone" value={phone} onChange={changePhone} />
+            <ContactFormInput
+              id="Phone"
+              value={phone}
+              type="tel"
+              // pattern="[0-9]"
+              onChange={changePhone}
+            />
           </div>
           <div className="col s12">
             <ContactFormTextArea
@@ -87,6 +96,7 @@ const ContactFormInput = ({ id, type = "text", value, onChange }) => {
         id={id}
         value={value}
         onChange={onChange}
+        required
       />
       <label htmlFor={id}>{id}</label>
     </div>
@@ -103,6 +113,7 @@ const ContactFormTextArea = ({ id, value, onChange }) => {
         name={id}
         value={value}
         onChange={onChange}
+        required
       />
     </div>
   );
diff --git a/src/pages/Contact.jsx b/src/pages/Contact.jsx
index 7ed8e8c..200804a 100644
--- a/src/pages/Contact.jsx
+++ b/src/pages/Contact.jsx
@@ -17,7 +17,7 @@ export const ContactPage = () => {
   ) : (
     <div className="container">
       <h2 className="logo">Contact Us</h2>
-      <ContactForm onSubmit={setIsSubmitted} />
+      <ContactForm setIsSubmitted={setIsSubmitted} />
     </div>
   );
 };
diff --git a/src/utils/mail.js b/src/utils/mail.js
new file mode 100644
index 0000000..1d068c9
--- /dev/null
+++ b/src/utils/mail.js
@@ -0,0 +1,43 @@
+// This must be set on the server using express
+import { createTransport } from "nodemailer";
+import { mailPassword } from "./secret";
+
+const myMail = "ruidy.nemausat@gmail.com";
+const myPass = mailPassword;
+
+const handleMail = (mailTo, subject, text) => {
+  let transporter = createTransport({
+    service: "gmail",
+    auth: {
+      user: myMail,
+      pass: myPass
+    }
+  });
+
+  let mailOptions = {
+    from: myMail,
+    to: mailTo,
+    subject: subject,
+    text: text
+  };
+
+  transporter.sendMail(mailOptions, function(error, info) {
+    if (error) {
+      console.log(error);
+    } else {
+      console.log("Email sent: " + info.response);
+    }
+  });
+};
+
+export const confirmationMail = (
+  mailTo,
+  subject = "Your message has been sent",
+  text = "Thanks for your message. We'll reply you soon."
+) => {
+  handleMail(mailTo, subject, text);
+};
+
+export const notificationMail = (mailTo = myMail, subject, text) => {
+  handleMail(mailTo, subject, text);
+};