From b8abcccbb2d9c7b5f46ceb4d602b0ae0e8372ec1 Mon Sep 17 00:00:00 2001 From: EnnJayWithAGreyHat Date: Tue, 18 Mar 2025 16:48:26 -0700 Subject: [PATCH 01/20] some small functionality changes iwth the "Get in Touch" element on the navbar, and image organization --- website/app/components/AboutUs.tsx | 7 +- website/app/components/ContactUs.tsx | 67 +++++++++++++----- website/app/components/Homepage.tsx | 4 +- website/app/components/Navbar.tsx | 58 ++++++++++----- website/app/components/Products.tsx | 7 +- .../public/{img => images}/front-image.jpeg | Bin .../{img => images}/front-page-fire.png | Bin website/public/images/payload.png | Bin 0 -> 288629 bytes website/public/images/scouter.png | Bin 0 -> 84419 bytes 9 files changed, 100 insertions(+), 43 deletions(-) rename website/public/{img => images}/front-image.jpeg (100%) rename website/public/{img => images}/front-page-fire.png (100%) create mode 100644 website/public/images/payload.png create mode 100644 website/public/images/scouter.png diff --git a/website/app/components/AboutUs.tsx b/website/app/components/AboutUs.tsx index d9eb34e..1790914 100644 --- a/website/app/components/AboutUs.tsx +++ b/website/app/components/AboutUs.tsx @@ -1,14 +1,13 @@ import Image from 'next/image'; import hardware from '../../public/images/aboutusimg.jpeg' -import ContactUs from './ContactUs'; export default function AboutUs() { return ( -
+

About Paragon

-
+

At Paragon Autonomous, we empower communities with cutting-edge drone technology designed to detect and suppress wildfires before they escalate. Our mission is to aid first responders by protecting lives, homes, and wildlife.

@@ -29,7 +28,7 @@ export default function AboutUs() { />
-
+

OUR FLIGHT PATH

diff --git a/website/app/components/ContactUs.tsx b/website/app/components/ContactUs.tsx index 9dfce49..3dbde5b 100644 --- a/website/app/components/ContactUs.tsx +++ b/website/app/components/ContactUs.tsx @@ -1,20 +1,32 @@ 'use client'; - -import { useState, ChangeEvent, FormEvent } from 'react'; +import { useState, useEffect, ChangeEvent, FormEvent } from 'react'; import emailjs from 'emailjs-com'; type FormData = { + name: string; email: string; message: string; category: string; }; -export default function ContactUs() { +type ContactUsProps = { + onClose: () => void; + widthClass?: string; +}; + +export default function ContactUs({ onClose, widthClass = 'max-w-2xl' }: ContactUsProps) { const [formData, setFormData] = useState({ + name: '', email: '', message: '', category: 'Website Error', }); + const [isVisible, setIsVisible] = useState(false); + + useEffect(() => { + // Trigger fade-in transition on mount + setIsVisible(true); + }, []); const handleChange = ( e: ChangeEvent @@ -29,6 +41,7 @@ export default function ContactUs() { 'your_service_id', 'your_template_id', { + name: formData.name, to_email: 'example@paragonautonomous.com', from_email: formData.email, message: formData.message, @@ -37,7 +50,7 @@ export default function ContactUs() { 'your_public_key' ); alert('Message sent successfully!'); - setFormData({ email: '', message: '', category: 'Website Error' }); + setFormData({ name: '', email: '', message: '', category: 'Website Error' }); } catch (error) { console.error('Error sending email:', error); alert('Failed to send message.'); @@ -45,18 +58,40 @@ export default function ContactUs() { }; return ( -
+
+ {/* Close button in top right corner */} +

Contact Us

- +
+ + +