diff --git a/.env.example b/.env.example new file mode 100644 index 0000000..75210ff --- /dev/null +++ b/.env.example @@ -0,0 +1,4 @@ +VITE_EMAILJS_SERVICE_ID=your_service_id_here +VITE_EMAILJS_TEMPLATE_ID_ADMIN=your_admin_template_id_here +VITE_EMAILJS_TEMPLATE_ID_USER=your_user_template_id_here +VITE_EMAILJS_PUBLIC_KEY=your_public_key_here diff --git a/src/pages/Contact.tsx b/src/pages/Contact.tsx index 5386caf..668a14a 100644 --- a/src/pages/Contact.tsx +++ b/src/pages/Contact.tsx @@ -5,10 +5,11 @@ import { useTranslation } from '../i18n'; import { Button, Input, Textarea } from '../components/ui'; import styles from './Contact.module.css'; -// EmailJS configuration - replace these with your actual IDs -const EMAILJS_SERVICE_ID = 'YOUR_SERVICE_ID'; -const EMAILJS_TEMPLATE_ID = 'YOUR_TEMPLATE_ID'; -const EMAILJS_PUBLIC_KEY = 'YOUR_PUBLIC_KEY'; +// EmailJS configuration +const EMAILJS_SERVICE_ID = import.meta.env.VITE_EMAILJS_SERVICE_ID; +const EMAILJS_TEMPLATE_ID_ADMIN = import.meta.env.VITE_EMAILJS_TEMPLATE_ID_ADMIN; +const EMAILJS_TEMPLATE_ID_USER = import.meta.env.VITE_EMAILJS_TEMPLATE_ID_USER; +const EMAILJS_PUBLIC_KEY = import.meta.env.VITE_EMAILJS_PUBLIC_KEY; interface FormData { name: string; @@ -70,17 +71,29 @@ export function Contact() { setSubmitStatus('idle'); try { - await emailjs.send( - EMAILJS_SERVICE_ID, - EMAILJS_TEMPLATE_ID, - { - from_name: formData.name, - from_email: formData.email, - subject: formData.subject, - message: formData.message, - }, - EMAILJS_PUBLIC_KEY - ); + const templateParams = { + from_name: formData.name, + from_email: formData.email, + subject: formData.subject, + message: formData.message, + }; + + await Promise.all([ + // Send to Admin + emailjs.send( + EMAILJS_SERVICE_ID, + EMAILJS_TEMPLATE_ID_ADMIN, + templateParams, + EMAILJS_PUBLIC_KEY + ), + // Send Auto-reply to User + emailjs.send( + EMAILJS_SERVICE_ID, + EMAILJS_TEMPLATE_ID_USER, + templateParams, + EMAILJS_PUBLIC_KEY + ), + ]); setSubmitStatus('success'); setFormData({ name: '', email: '', subject: '', message: '' }); diff --git a/src/vite-env.d.ts b/src/vite-env.d.ts index bc4bbf1..fc1e03c 100644 --- a/src/vite-env.d.ts +++ b/src/vite-env.d.ts @@ -1,5 +1,16 @@ /// +interface ImportMetaEnv { + readonly VITE_EMAILJS_SERVICE_ID: string + readonly VITE_EMAILJS_TEMPLATE_ID_ADMIN: string + readonly VITE_EMAILJS_TEMPLATE_ID_USER: string + readonly VITE_EMAILJS_PUBLIC_KEY: string +} + +interface ImportMeta { + readonly env: ImportMetaEnv +} + declare module '*.module.css' { const classes: { [key: string]: string }; export default classes;