2.0.1

.gitignore

@@ -1,3 +1,8 @@
 node_modules/
 */node_modules/
 */build/
+
+**/node_modules/
+**/build/
+.DS_Store
+.env

frontend/json/runtimeError.json

@@ -0,0 +1 @@
+{}

frontend/src/components/WebPageComponents/ContactFormComponent/index.tsx

@@ -9,6 +9,8 @@ import FormWithImage from './designs/FormWithImage';
 import { ToastContainer, toast } from 'react-toastify';
 import axios from 'axios';
 import 'react-toastify/dist/ReactToastify.css';
+import { emailJsServiceId, emailJsTemplateId, emailJsUserId, emailJsPublicKey } from '../../../config';
+
 
 export default function ContactFormSection({
   projectName,
@@ -44,9 +46,25 @@ export default function ContactFormSection({
 
   const handleSubmit = async (values, { setSubmitting, resetForm }) => {
     try {
-      await axios.post('/contact-form/send', values);
+      const formData = new FormData();
-      toast.success('Your message has been sent successfully!');
+      formData.append('service_id', emailJsServiceId);
-      resetForm();
+      formData.append('template_id', emailJsTemplateId);
+      formData.append('user_id', emailJsUserId);
+      formData.append('public_key', emailJsPublicKey);
+
+      Object.entries(values).forEach(([key, val]) => {
+        formData.append(key, val as any);
+      });
+      const response = await fetch('https://api.emailjs.com/api/v1.0/email/send-form', {
+        method: 'POST',
+        body: formData,
+      });
+      if (response.ok) {
+        toast.success('Your message has been sent successfully!');
+        resetForm();
+      } else {
+        toast.error('There was an error sending your message');
+      }
     } catch (error) {
       toast.error('There was an error sending your message');
     } finally {

frontend/src/config.ts

@@ -20,3 +20,10 @@ export const getPageTitle = (currentPageTitle: string) =>
   `${currentPageTitle} — ${appTitle}`;
 
 export const tinyKey = process.env.NEXT_PUBLIC_TINY_KEY || '';
+
+export const emailJsServiceId = process.env.NEXT_PUBLIC_EMAILJS_SERVICE_ID || '';
+export const emailJsTemplateId = process.env.NEXT_PUBLIC_EMAILJS_TEMPLATE_ID || '';
+export const emailJsUserId = process.env.NEXT_PUBLIC_EMAILJS_USER_ID || '';
+export const emailJsPublicKey = process.env.NEXT_PUBLIC_EMAILJS_PUBLIC_KEY || '';
+
+

frontend/src/pages/web_pages/contact.tsx

@@ -66,6 +66,15 @@ export default function WebSite() {
           mainText={`Reach Out to ${projectName} `}
           subTitle={`Feel free to contact us anytime. ${projectName} is committed to providing timely responses to all your inquiries.`}
         />
+        <section className="bg-white py-8">
+          <div className="container mx-auto px-4 text-center">
+            <h2 className="text-2xl font-bold mb-4">Contact Details</h2>
+            <p className="mb-2">Address: Lado Sarai, Saket, New Delhi, 110030</p>
+            <p className="mb-2">Phone: 9041253266</p>
+            <p className="mb-2">Email: <a href="mailto:rishabh200602per@gmail.com" className="text-blue-500 hover:underline">rishabh200602per@gmail.com</a></p>
+          </div>
+        </section>
+
       </main>
       <WebSiteFooter projectName={'Zynorix Solutions'} />
     </div>