Skip to content

sujata / advithconsulting.io-frontend

Go to a project
Toggle navigation
Toggle navigation pinning
Commit f1e111cf by sujata
Options

chnage in mail

1 parent e4dc9099
Inline Side-by-side
Showing 5 changed files with 222 additions and 181 deletions
layout/GoogleMapComponent.tsx 0 → 100644
import React, { useState } from "react";
import { GoogleMap, LoadScript, Marker, InfoWindow } from "@react-google-maps/api";
// Example locations (you can replace with Strapi data or your own list)
const locations = [
{ id: 1, name: "Location One", lat: 25.276987, lng: 55.296249 },
{ id: 2, name: "Location Two", lat: 25.204849, lng: 55.270783 },
{ id: 3, name: "Location Three", lat: 25.197197, lng: 55.274376 },
];
const containerStyle = {
width: "100%",
height: "600px",
};
const center = {
lat: 25.276987,
lng: 55.296249,
};
const GoogleMapComponent: React.FC = () => {
const [selected, setSelected] = useState<any>(null);
return (
<LoadScript googleMapsApiKey={process.env.NEXT_PUBLIC_GOOGLE_MAPS_API_KEY || ""}>
<GoogleMap mapContainerStyle={containerStyle} center={center} zoom={12}>
{locations.map((loc) => (
<Marker
key={loc.id}
position={{ lat: loc.lat, lng: loc.lng }}
onClick={() => setSelected(loc)}
/>
))}
{selected && (
<InfoWindow
position={{ lat: selected.lat, lng: selected.lng }}
onCloseClick={() => setSelected(null)}
>
<div>
<h4>{selected.name}</h4>
<p>Lat: {selected.lat}, Lng: {selected.lng}</p>
</div>
</InfoWindow>
)}
</GoogleMap>
</LoadScript>
);
};
export default GoogleMapComponent;
package-lock.json
...@@ -8,6 +8,7 @@ ...@@ -8,6 +8,7 @@
"name": "advith-consulting", "name": "advith-consulting",
"version": "0.1.0", "version": "0.1.0",
"dependencies": { "dependencies": {
"@react-google-maps/api": "^2.20.7",
"@reduxjs/toolkit": "^2.3.0", "@reduxjs/toolkit": "^2.3.0",
"axios": "^1.7.7", "axios": "^1.7.7",
"bootstrap": "^5.3.3", "bootstrap": "^5.3.3",
...@@ -103,6 +104,22 @@ ...@@ -103,6 +104,22 @@
"node": "^12.22.0 || ^14.17.0 || >=16.0.0" "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
} }
}, },
"node_modules/@googlemaps/js-api-loader": {
"version": "1.16.8",
"resolved": "https://registry.npmjs.org/@googlemaps/js-api-loader/-/js-api-loader-1.16.8.tgz",
"integrity": "sha512-CROqqwfKotdO6EBjZO/gQGVTbeDps5V7Mt9+8+5Q+jTg5CRMi3Ii/L9PmV3USROrt2uWxtGzJHORmByxyo9pSQ==",
"license": "Apache-2.0"
},
"node_modules/@googlemaps/markerclusterer": {
"version": "2.5.3",
"resolved": "https://registry.npmjs.org/@googlemaps/markerclusterer/-/markerclusterer-2.5.3.tgz",
"integrity": "sha512-x7lX0R5yYOoiNectr10wLgCBasNcXFHiADIBdmn7jQllF2B5ENQw5XtZK+hIw4xnV0Df0xhN4LN98XqA5jaiOw==",
"license": "Apache-2.0",
"dependencies": {
"fast-deep-equal": "^3.1.3",
"supercluster": "^8.0.1"
}
},
"node_modules/@humanwhocodes/config-array": { "node_modules/@humanwhocodes/config-array": {
"version": "0.13.0", "version": "0.13.0",
"resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.13.0.tgz", "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.13.0.tgz",
...@@ -341,6 +358,36 @@ ...@@ -341,6 +358,36 @@
"react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0" "react": "^16.8.0 || ^17.0.0-rc.1 || ^18.0.0 || ^19.0.0"
} }
}, },
"node_modules/@react-google-maps/api": {
"version": "2.20.7",
"resolved": "https://registry.npmjs.org/@react-google-maps/api/-/api-2.20.7.tgz",
"integrity": "sha512-ys7uri3V6gjhYZUI43srHzSKDC6/jiKTwHNlwXFTvjeaJE3M3OaYBt9FZKvJs8qnOhL6i6nD1BKJoi1KrnkCkg==",
"license": "MIT",
"dependencies": {
"@googlemaps/js-api-loader": "1.16.8",
"@googlemaps/markerclusterer": "2.5.3",
"@react-google-maps/infobox": "2.20.0",
"@react-google-maps/marker-clusterer": "2.20.0",
"@types/google.maps": "3.58.1",
"invariant": "2.2.4"
},
"peerDependencies": {
"react": "^16.8 || ^17 || ^18 || ^19",
"react-dom": "^16.8 || ^17 || ^18 || ^19"
}
},
"node_modules/@react-google-maps/infobox": {
"version": "2.20.0",
"resolved": "https://registry.npmjs.org/@react-google-maps/infobox/-/infobox-2.20.0.tgz",
"integrity": "sha512-03PJHjohhaVLkX6+NHhlr8CIlvUxWaXhryqDjyaZ8iIqqix/nV8GFdz9O3m5OsjtxtNho09F/15j14yV0nuyLQ==",
"license": "MIT"
},
"node_modules/@react-google-maps/marker-clusterer": {
"version": "2.20.0",
"resolved": "https://registry.npmjs.org/@react-google-maps/marker-clusterer/-/marker-clusterer-2.20.0.tgz",
"integrity": "sha512-tieX9Va5w1yP88vMgfH1pHTacDQ9TgDTjox3tLlisKDXRQWdjw+QeVVghhf5XqqIxXHgPdcGwBvKY6UP+SIvLw==",
"license": "MIT"
},
"node_modules/@reduxjs/toolkit": { "node_modules/@reduxjs/toolkit": {
"version": "2.3.0", "version": "2.3.0",
"resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-2.3.0.tgz", "resolved": "https://registry.npmjs.org/@reduxjs/toolkit/-/toolkit-2.3.0.tgz",
...@@ -416,6 +463,12 @@ ...@@ -416,6 +463,12 @@
"tslib": "^2.4.0" "tslib": "^2.4.0"
} }
}, },
"node_modules/@types/google.maps": {
"version": "3.58.1",
"resolved": "https://registry.npmjs.org/@types/google.maps/-/google.maps-3.58.1.tgz",
"integrity": "sha512-X9QTSvGJ0nCfMzYOnaVs/k6/4L+7F5uCS+4iUmkLEls6J9S/Phv+m/i3mDeyc49ZBgwab3EFO1HEoBY7k98EGQ==",
"license": "MIT"
},
"node_modules/@types/json5": { "node_modules/@types/json5": {
"version": "0.0.29", "version": "0.0.29",
"resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz", "resolved": "https://registry.npmjs.org/@types/json5/-/json5-0.0.29.tgz",
...@@ -1841,8 +1894,7 @@ ...@@ -1841,8 +1894,7 @@
"node_modules/fast-deep-equal": { "node_modules/fast-deep-equal": {
"version": "3.1.3", "version": "3.1.3",
"resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz", "resolved": "https://registry.npmjs.org/fast-deep-equal/-/fast-deep-equal-3.1.3.tgz",
"integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q==", "integrity": "sha512-f3qQ9oQy9j2AhBe/H9VC91wLmKBCCU/gDOnKNAYG5hswO7BLKj09Hc5HYNz9cGI++xlpDCIgDaitVs03ATR84Q=="
"peer": true
}, },
"node_modules/fast-glob": { "node_modules/fast-glob": {
"version": "3.3.2", "version": "3.3.2",
...@@ -2817,6 +2869,12 @@ ...@@ -2817,6 +2869,12 @@
"node": ">=4.0" "node": ">=4.0"
} }
}, },
"node_modules/kdbush": {
"version": "4.0.2",
"resolved": "https://registry.npmjs.org/kdbush/-/kdbush-4.0.2.tgz",
"integrity": "sha512-WbCVYJ27Sz8zi9Q7Q0xHC+05iwkm3Znipc2XTlrnJbsHMYktW4hPhXUE8Ys1engBrvffoSCqbil1JQAa7clRpA==",
"license": "ISC"
},
"node_modules/keyv": { "node_modules/keyv": {
"version": "4.5.4", "version": "4.5.4",
"resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz", "resolved": "https://registry.npmjs.org/keyv/-/keyv-4.5.4.tgz",
...@@ -4042,6 +4100,15 @@ ...@@ -4042,6 +4100,15 @@
} }
} }
}, },
"node_modules/supercluster": {
"version": "8.0.1",
"resolved": "https://registry.npmjs.org/supercluster/-/supercluster-8.0.1.tgz",
"integrity": "sha512-IiOea5kJ9iqzD2t7QJq/cREyLHTtSmUT6gQsweojg9WH2sYJqZK9SswTu6jrscO6D1G5v5vYZ9ru/eq85lXeZQ==",
"license": "ISC",
"dependencies": {
"kdbush": "^4.0.2"
}
},
"node_modules/supports-color": { "node_modules/supports-color": {
"version": "7.2.0", "version": "7.2.0",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-7.2.0.tgz",
......
package.json
...@@ -9,6 +9,7 @@ ...@@ -9,6 +9,7 @@
"lint": "next lint" "lint": "next lint"
}, },
"dependencies": { "dependencies": {
"@react-google-maps/api": "^2.20.7",
"@reduxjs/toolkit": "^2.3.0", "@reduxjs/toolkit": "^2.3.0",
"axios": "^1.7.7", "axios": "^1.7.7",
"bootstrap": "^5.3.3", "bootstrap": "^5.3.3",
......
pages/api/sendEmail.js
import nodemailer from "nodemailer"; import nodemailer from "nodemailer";
export default function (req, res) { export default async function handler(req, res) {
if (req.method !== "POST") {
return res.status(405).json({ error: "Method not allowed" });
}
const transporter = nodemailer.createTransport({ const transporter = nodemailer.createTransport({
host: "smtp-mail.outlook.com", host: "smtp.office365.com",
port: 587, port: 587,
secure: false, secure: false, // use TLS, not SSL
auth: { auth: {
user: "info@advithconsulting.in", user: "support@advithitec.in",
pass: "!nf0@2019", pass: "supp@123",
},
tls: {
rejectUnauthorized: false,
}, },
}); });
var maillist = ["info@advithconsulting.in"]; const maillist = ["support@advithitec.in"];
const mailData = { const mailData = {
from: "info@advithconsulting.in", from: "support@advithitec.in",
to: maillist, to: maillist,
subject: `Advith Consulting Contact Form Leads`, subject: "Advith Consulting Service Form Leads",
html: ` html: `
<table border="0" cellpadding="0" cellspacing="0" style="padding-top:35px; background-color:#f1f1f1; font-family:Verdana,Arial,sans-serif; color:#454748; width:100%; border-collapse:separate;"> <table border="0" cellpadding="0" cellspacing="0" style="padding-top:35px; background-color:#f1f1f1; font-family:Verdana,Arial,sans-serif; color:#454748; width:100%;">
<tbody> <tbody>
<tr> <tr>
<td align="center">
<table width="590" cellpadding="0" cellspacing="0" style="background-color:#fff; color:#454748; padding:16px;">
<tr>
<td align="center"> <td align="center">
<table border="0" cellpadding="0" cellspacing="0" width="590" style="padding:16px; background-color:white; color:#454748; border-collapse:separate;"> <strong style="font-size:16px;">Welcome to Advith Consulting</strong>
<tbody>
<tr>
<td align="center" style="min-width:590px;">
<table border="0" cellpadding="0" cellspacing="0" width="590" style="min-width:590px; background-color:white; padding:0px 8px 0px 8px; border-collapse:separate;">
<tbody>
<tr>
<td valign="middle">
<strong style="font-size:16px; margin: 0;">Welcome to Advith Consulting</strong>
</td>
</tr>
<tr>
<td colspan="2" style="text-align:center;">
<hr width="100%" style="border-top-color:rgba(0,0,0,0.1); border-top-style:solid; border-top-width:1px; border-left-width:0px; border-bottom-width:0px; border-right-width:0px; overflow-y:visible; overflow-x:visible; height:0px; box-sizing:content-box; background-color:rgb(204,204,204); border:medium none; clear:both; display:block; font-size:0px; min-height:1px; line-height:0; margin:16px 0px 16px 0px;">
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td align="center" style="min-width:590px;">
<table border="0" cellpadding="0" cellspacing="0" width="590" style="min-width:590px; background-color:white; padding:0px 8px 0px 8px; border-collapse:separate;">
<tbody>
<tr>
<td colspan="2" valign="top" style="font-size:13px;">
<div style="font-size:13px; font-family:&quotLucida Grande&quot,Helvetica,Verdana,Arial,sans-serif;">
Details below are enquiry from website!<br><br>
</div>
</td>
</tr>
<tr>
<td valign="top" style="font-size:13px;">
<div style="font-size:13px; font-family:&quotLucida Grande&quot,Helvetica,Verdana,Arial,sans-serif;">
<tr><td colspan="2"><b>Personal Details:</b></td></tr>
<tr><td style="width: 30%;">Name:</td><td style="width: 70%;">${req.body.Name}</td></tr>
<tr><td style="width: 30%;">Email:</td><td style="width: 70%;">${req.body.Email}</td></tr>
<tr><td style="width: 30%;">Mobile:</td><td style="width: 70%;">${req.body.Mobile}</td></tr>
<tr><td style="width: 30%;">Company:</td><td style="width: 70%;">${req.body.Company}</td></tr>
<tr><td style="width: 30%;">Message:</td><td style="width: 70%;">${req.body.AdditionalMessage }</td></tr>
<br><br>
</div>
</td>
</tr>
<tr>
<td colspan="2" style="text-align:center;">
<hr width="100%" style="border-top-color:rgba(0,0,0,0.1); border-top-style:solid; border-top-width:1px; border-left-width:0px; border-bottom-width:0px; border-right-width:0px; overflow-y:visible; overflow-x:visible; height:0px; box-sizing:content-box; background-color:rgb(204,204,204); border:medium none; clear:both; display:block; font-size:0px; min-height:1px; line-height:0; margin:16px 0px 16px 0px;">
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td> </td>
</tr> </tr>
<tr> <tr><td><hr style="border:1px solid #ddd; margin:16px 0;" /></td></tr>
<td align="center" style="min-width:590px;"> <tr>
<table border="0" cellpadding="0" cellspacing="0" width="590" style="min-width:590px; background-color:#f1f1f1; color:#454748; padding:8px; border-collapse:separate;"> <td>
<tbody> <p>Details below are enquiry from website:</p>
<tr> <table width="100%" cellpadding="4" cellspacing="0" style="font-size:13px;">
<td style="text-align:center; font-size:13px;"><br></td> <tr><td colspan="2"><b>Personal Details:</b></td></tr>
</tr> <tr><td width="30%">Name:</td><td width="70%">${req.body.Name || ""}</td></tr>
</tbody> <tr><td>Email:</td><td>${req.body.Email || ""}</td></tr>
</table> <tr><td>Mobile:</td><td>${req.body.Mobile || ""}</td></tr>
<tr><td>Company/Service:</td><td>${req.body.service || ""}</td></tr>
</table>
</td> </td>
</tr> </tr>
</tbody> </table>
</table>`, </td>
</tr>
</tbody>
</table>
`,
}; };
transporter.sendMail(mailData, function (err, info) {
if (err) console.log(err); try {
else console.log(info); const info = await transporter.sendMail(mailData);
}); console.log("✅ Email sent:", info.response);
console.log(req.body); res.status(200).json({ success: true, message: "Email sent successfully" });
res.send("success"); } catch (error) {
console.error("❌ Email send failed:", error);
res.status(500).json({ success: false, error: "Failed to send email", details: error.message });
}
} }
pages/api/sendEmailHome.js
import nodemailer from "nodemailer"; import nodemailer from "nodemailer";
export default function (req, res) { export default async function handler(req, res) {
if (req.method !== "POST") {
return res.status(405).json({ error: "Method not allowed" });
}
const transporter = nodemailer.createTransport({ const transporter = nodemailer.createTransport({
host: "smtp.office365.com", host: "smtp.office365.com",
port: 587, port: 587,
secure: false, secure: false, // use TLS, not SSL
auth: { auth: {
user: "support@advithitec.in", user: "support@advithitec.in",
pass: "supp@123", pass: "supp@123",
},
tls: {
rejectUnauthorized: false,
}, },
}); });
var maillist = ["sujatalogicloop@gmail.com"]; const maillist = ["support@advithitec.in"];
const mailData = { const mailData = {
from: "support@advithitec.in", from: "support@advithitec.in",
to: maillist, to: maillist,
subject: `Advith Consulting Service Form Leads`, subject: "Advith Consulting Service Form Leads",
html: ` html: `
<table border="0" cellpadding="0" cellspacing="0" style="padding-top:35px; background-color:#f1f1f1; font-family:Verdana,Arial,sans-serif; color:#454748; width:100%; border-collapse:separate;"> <table border="0" cellpadding="0" cellspacing="0" style="padding-top:35px; background-color:#f1f1f1; font-family:Verdana,Arial,sans-serif; color:#454748; width:100%;">
<tbody> <tbody>
<tr> <tr>
<td align="center">
<table width="590" cellpadding="0" cellspacing="0" style="background-color:#fff; color:#454748; padding:16px;">
<tr>
<td align="center"> <td align="center">
<table border="0" cellpadding="0" cellspacing="0" width="590" style="padding:16px; background-color:white; color:#454748; border-collapse:separate;"> <strong style="font-size:16px;">Welcome to Advith Consulting</strong>
<tbody>
<tr>
<td align="center" style="min-width:590px;">
<table border="0" cellpadding="0" cellspacing="0" width="590" style="min-width:590px; background-color:white; padding:0px 8px 0px 8px; border-collapse:separate;">
<tbody>
<tr>
<td valign="middle">
<strong style="font-size:16px; margin: 0;">Welcome to Advith Consulting</strong>
</td>
</tr>
<tr>
<td colspan="2" style="text-align:center;">
<hr width="100%" style="border-top-color:rgba(0,0,0,0.1); border-top-style:solid; border-top-width:1px; border-left-width:0px; border-bottom-width:0px; border-right-width:0px; overflow-y:visible; overflow-x:visible; height:0px; box-sizing:content-box; background-color:rgb(204,204,204); border:medium none; clear:both; display:block; font-size:0px; min-height:1px; line-height:0; margin:16px 0px 16px 0px;">
</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr>
<td align="center" style="min-width:590px;">
<table border="0" cellpadding="0" cellspacing="0" width="590" style="min-width:590px; background-color:white; padding:0px 8px 0px 8px; border-collapse:separate;">
<tbody>
<tr>
<td colspan="2" valign="top" style="font-size:13px;">
<div style="font-size:13px; font-family:&quotLucida Grande&quot,Helvetica,Verdana,Arial,sans-serif;">
Details below are enquiry from website!<br><br>
</div>
</td>
</tr>
<tr>
<td valign="top" style="font-size:13px;">
<div style="font-size:13px; font-family:&quotLucida Grande&quot,Helvetica,Verdana,Arial,sans-serif;">
<tr><td colspan="2"><b>Personal Details:</b></td></tr>
<tr><td style="width: 30%;">Name:</td><td style="width: 70%;">${req.body.Name}</td></tr>
<tr><td style="width: 30%;">Email:</td><td style="width: 70%;">${req.body.Email}</td></tr>
<tr><td style="width: 30%;">Mobile:</td><td style="width: 70%;">${req.body.Mobile}</td></tr>
<tr><td style="width: 30%;">Company:</td><td style="width: 70%;">${req.body.service}</td></tr>
<br><br>
</div>
</td>
</tr>
<tr>
<td colspan="2" style="text-align:center;">
<hr width="100%" style="border-top-color:rgba(0,0,0,0.1); border-top-style:solid; border-top-width:1px; border-left-width:0px; border-bottom-width:0px; border-right-width:0px; overflow-y:visible; overflow-x:visible; height:0px; box-sizing:content-box; background-color:rgb(204,204,204); border:medium none; clear:both; display:block; font-size:0px; min-height:1px; line-height:0; margin:16px 0px 16px 0px;">
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td> </td>
</tr> </tr>
<tr> <tr><td><hr style="border:1px solid #ddd; margin:16px 0;" /></td></tr>
<td align="center" style="min-width:590px;"> <tr>
<table border="0" cellpadding="0" cellspacing="0" width="590" style="min-width:590px; background-color:#f1f1f1; color:#454748; padding:8px; border-collapse:separate;"> <td>
<tbody> <p>Details below are enquiry from website:</p>
<tr> <table width="100%" cellpadding="4" cellspacing="0" style="font-size:13px;">
<td style="text-align:center; font-size:13px;"><br></td> <tr><td colspan="2"><b>Personal Details:</b></td></tr>
</tr> <tr><td width="30%">Name:</td><td width="70%">${req.body.Name || ""}</td></tr>
</tbody> <tr><td>Email:</td><td>${req.body.Email || ""}</td></tr>
</table> <tr><td>Mobile:</td><td>${req.body.Mobile || ""}</td></tr>
<tr><td>Company/Service:</td><td>${req.body.service || ""}</td></tr>
</table>
</td> </td>
</tr> </tr>
</tbody> </table>
</table>`, </td>
</tr>
</tbody>
</table>
`,
}; };
transporter.sendMail(mailData, function (err, info) {
if (err) console.log(err); try {
else console.log(info); const info = await transporter.sendMail(mailData);
}); console.log("✅ Email sent:", info.response);
console.log(req.body); res.status(200).json({ success: true, message: "Email sent successfully" });
res.send("success"); } catch (error) {
console.error("❌ Email send failed:", error);
res.status(500).json({ success: false, error: "Failed to send email", details: error.message });
}
} }
Styling with Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!