Skip to content

Commit

Permalink
feat: add Send API endpoint
Browse files Browse the repository at this point in the history
  • Loading branch information
martapanc committed Sep 17, 2023
1 parent a501902 commit b3b4685
Show file tree
Hide file tree
Showing 5 changed files with 92 additions and 10 deletions.
2 changes: 2 additions & 0 deletions .env.example
Original file line number Diff line number Diff line change
Expand Up @@ -3,3 +3,5 @@
NEXT_PUBLIC_SHOW_LOGGER="false"

GRAPHQL_URL=https://some-url.com/graphql

SENDGRID_API_KEY=Abcde
2 changes: 2 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@
"@emotion/styled": "^11.11.0",
"@heroicons/react": "^2.0.18",
"@mui/material": "^5.13.5",
"@sendgrid/mail": "^7.7.0",
"@types/styled-components": "^5.1.0",
"classnames": "^2.3.2",
"clsx": "^2.0.0",
Expand All @@ -38,6 +39,7 @@
"next": "^13.4.9",
"next-cloudinary": "^4.18.1",
"next-themes": "^0.2.1",
"nodemailer": "^6.9.5",
"plop": "^3.1.2",
"react": "^18.2.0",
"react-dom": "^18.2.0",
Expand Down
22 changes: 12 additions & 10 deletions src/components/molecules/ContactForm/ContactForm.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -68,14 +68,13 @@ const ContactForm = () => {
setSubmitting: (arg: boolean) => void,
resetForm: () => void,
) => {
// eslint-disable-next-line no-console
console.log(JSON.stringify(formValues, null, 2));
const json = JSON.stringify(formValues, null, 2);

setError(false);
setSuccess(false);

const res = await fetch('/api/contact/send', {
body: JSON.stringify(formValues),
const res = await fetch('/api/contacts/send', {
body: json,
headers: {
'Content-Type': 'application/json',
},
Expand All @@ -99,6 +98,7 @@ const ContactForm = () => {
<Formik
initialValues={{
name: '',
company: '',
email: '',
subject: '',
message: '',
Expand All @@ -112,16 +112,18 @@ const ContactForm = () => {
return (
<Form role='form' className='mt-4'>
{success && (
<div className='rounded-md bg-green-100 px-4 py-2 font-bold text-green-600 ring-1 ring-green-600'>
Thanks for your message. I will get back to you as soon as
<div className='rounded-md bg-green-100 px-4 py-2 text-green-600 ring-1 ring-green-600 font-semibold'>
Thanks for your message! 🤗 I will get back to you as soon as
possible.
</div>
)}
{error && (
<div className='rounded-md bg-red-100 px-4 py-2 font-bold text-red-600 ring-1 ring-red-600'>
Whoops, something went wrong on our side! 😟 Please try again -
if the issue persists, try reaching out directly at
marta_panc@me.com
<div className='rounded-md bg-red-100 px-4 py-2 text-red-600 ring-1 ring-red-600 font-semibold'>
Whoops, something went wrong on our side! 😟 <br /> Please try
again - if the issue persists, reach out directly at
<a className='ms-1 underline' href='mailto:info@martacodes.it'>
info@martacodes.it
</a>
</div>
)}

Expand Down
36 changes: 36 additions & 0 deletions src/pages/api/contacts/send.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,36 @@
import * as sgMail from '@sendgrid/mail';
import { NextApiRequest, NextApiResponse } from 'next';

export default async function handler(
req: NextApiRequest,
res: NextApiResponse,
) {
const { name, company, email, subject, message } = req.body;

if (!email) {
return res.status(400).json({ error: 'Email address is required' });
}

const sgApiKey = process.env.SENDGRID_API_KEY || '';

sgMail.setApiKey(sgApiKey);

const msg = {
to: 'info@martacodes.it',
cc: 'marta_panc@me.com',
from: `${name} ${company ? ' @ ' + company : ''} <marta_panc@me.com>`,
replyTo: email,
subject: subject,
text: message,
html: `<div><p>${message}</p></div>`,
};

try {
await sgMail.send(msg);
return res.status(200).json({ message: 'Email sent' });
} catch (error) {
// eslint-disable-next-line no-console
console.error('Error sending email:', error);
return res.status(500).json({ error: 'Email could not be sent' });
}
}
40 changes: 40 additions & 0 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -2701,6 +2701,29 @@
resolved "https://verdaccio.mein-recycling.de/@rushstack%2feslint-patch/-/eslint-patch-1.3.3.tgz#16ab6c727d8c2020a5b6e4a176a243ecd88d8d69"
integrity sha512-0xd7qez0AQ+MbHatZTlI1gu5vkG8r7MYRUJAHPAHJBmGLs16zpkrpAVLvjQKQOqaXPDUBwOiJzNc00znHSCVBw==

"@sendgrid/client@^7.7.0":
version "7.7.0"
resolved "https://verdaccio.mein-recycling.de/@sendgrid%2fclient/-/client-7.7.0.tgz#f8f67abd604205a0d0b1af091b61517ef465fdbf"
integrity sha512-SxH+y8jeAQSnDavrTD0uGDXYIIkFylCo+eDofVmZLQ0f862nnqbC3Vd1ej6b7Le7lboyzQF6F7Fodv02rYspuA==
dependencies:
"@sendgrid/helpers" "^7.7.0"
axios "^0.26.0"

"@sendgrid/helpers@^7.7.0":
version "7.7.0"
resolved "https://verdaccio.mein-recycling.de/@sendgrid%2fhelpers/-/helpers-7.7.0.tgz#93fb4b6e2f0dc65080440d6a784cc93e8e148757"
integrity sha512-3AsAxfN3GDBcXoZ/y1mzAAbKzTtUZ5+ZrHOmWQ279AuaFXUNCh9bPnRpN504bgveTqoW+11IzPg3I0WVgDINpw==
dependencies:
deepmerge "^4.2.2"

"@sendgrid/mail@^7.7.0":
version "7.7.0"
resolved "https://verdaccio.mein-recycling.de/@sendgrid%2fmail/-/mail-7.7.0.tgz#aba09f5ce2e9d8ceee92284c3ea8b4a90b0e38fe"
integrity sha512-5+nApPE9wINBvHSUxwOxkkQqM/IAAaBYoP9hw7WwgDNQPxraruVqHizeTitVtKGiqWCKm2mnjh4XGN3fvFLqaw==
dependencies:
"@sendgrid/client" "^7.7.0"
"@sendgrid/helpers" "^7.7.0"

"@sinclair/typebox@^0.27.8":
version "0.27.8"
resolved "https://verdaccio.mein-recycling.de/@sinclair%2ftypebox/-/typebox-0.27.8.tgz#6667fac16c436b5434a387a34dedb013198f6e6e"
Expand Down Expand Up @@ -5156,6 +5179,13 @@ axe-core@^4.6.2:
resolved "https://verdaccio.mein-recycling.de/axe-core/-/axe-core-4.7.2.tgz#040a7342b20765cb18bb50b628394c21bccc17a0"
integrity sha512-zIURGIS1E1Q4pcrMjp+nnEh+16G56eG/MUllJH8yEvw7asDo7Ac9uhC9KIH5jzpITueEZolfYglnCGIuSBz39g==

axios@^0.26.0:
version "0.26.1"
resolved "https://verdaccio.mein-recycling.de/axios/-/axios-0.26.1.tgz#1ede41c51fcf51bbbd6fd43669caaa4f0495aaa9"
integrity sha512-fPwcX4EvnSHuInCMItEhAGnaSEXRBjtzh9fOtsE6E1G6p7vl7edEeZe11QHf18+6+9gR5PbKV/sGKNaD8YaMeA==
dependencies:
follow-redirects "^1.14.8"

axobject-query@^3.1.1:
version "3.2.1"
resolved "https://verdaccio.mein-recycling.de/axobject-query/-/axobject-query-3.2.1.tgz#39c378a6e3b06ca679f29138151e45b2b32da62a"
Expand Down Expand Up @@ -7739,6 +7769,11 @@ focus-trap@^7.5.2:
dependencies:
tabbable "^6.2.0"

follow-redirects@^1.14.8:
version "1.15.2"
resolved "https://verdaccio.mein-recycling.de/follow-redirects/-/follow-redirects-1.15.2.tgz#b460864144ba63f2681096f274c4e57026da2c13"
integrity sha512-VQLG33o04KaQ8uYi2tVNbdrWp1QWxNNea+nmIB4EVM28v0hmP17z7aG1+wAkNzVq4KeXTq3221ye5qTJP91JwA==

for-each@^0.3.3:
version "0.3.3"
resolved "https://verdaccio.mein-recycling.de/for-each/-/for-each-0.3.3.tgz#69b447e88a0a5d32c3e7084f3f1710034b21376e"
Expand Down Expand Up @@ -11019,6 +11054,11 @@ node-releases@^2.0.13:
resolved "https://verdaccio.mein-recycling.de/node-releases/-/node-releases-2.0.13.tgz#d5ed1627c23e3461e819b02e57b75e4899b1c81d"
integrity sha512-uYr7J37ae/ORWdZeQ1xxMJe3NtdmqMC/JZK+geofDrkLUApKRHPd18/TxtBOJ4A0/+uUIliorNrfYV6s1b02eQ==

nodemailer@^6.9.5:
version "6.9.5"
resolved "https://verdaccio.mein-recycling.de/nodemailer/-/nodemailer-6.9.5.tgz#eaeae949c62ec84ef1e9128df89fc146a1017aca"
integrity sha512-/dmdWo62XjumuLc5+AYQZeiRj+PRR8y8qKtFCOyuOl1k/hckZd8durUUHs/ucKx6/8kN+wFxqKJlQ/LK/qR5FA==

normalize-package-data@^2.5.0:
version "2.5.0"
resolved "https://verdaccio.mein-recycling.de/normalize-package-data/-/normalize-package-data-2.5.0.tgz#e66db1838b200c1dfc233225d12cb36520e234a8"
Expand Down

0 comments on commit b3b4685

Please sign in to comment.