Fixed contact form on main page

Sends data to mail
Secrets from self-hosted infisical

src/components/ContactForm.tsx

@@ -46,10 +46,21 @@ export function ContactForm({ currentLocale }) {
     },
   });
 
-  function onSubmit(values: z.infer<typeof formSchema>) {
-    // Do something with the form values.
-    // ✅ This will be type-safe and validated.
-    console.log(values);
+  async function onSubmit(values: z.infer<typeof formSchema>) {
+    const formData = new FormData();
+    
+    for (const value of Object.keys(values)) {
+      formData.append(value, values[value])
+    }
+    console.log(formData)
+
+    const response = await fetch("/api", {
+        method: "POST",
+        body: formData
+    });
+
+    const data = await response.json();
+    console.log(data.message)
   }
 
   return (
@@ -64,7 +75,7 @@ export function ContactForm({ currentLocale }) {
       </DialogTrigger>
       <DialogContent className="sm:max-w-[425px]">
         <DialogHeader>
-          <DialogTitle><h1 className="text-foreground">{t("contact").title}</h1></DialogTitle>
+          <DialogTitle><p className="text-foreground">{t("contact").title}</p></DialogTitle>
           <DialogDescription>{t("contact").description}</DialogDescription>
         </DialogHeader>
 

src/pages/api.js

@@ -0,0 +1,70 @@
+import nodemailer from "nodemailer";
+import { createId } from '@paralleldrive/cuid2';
+import { InfisicalClient } from "@infisical/sdk";
+
+const client = new InfisicalClient({
+    siteUrl: import.meta.env.INFISICAL_URL,
+    auth: {
+      universalAuth: {
+        clientId: import.meta.env.INFISICAL_CLIENTID,
+        clientSecret: import.meta.env.INFISICAL_SECRET
+      }
+    }
+});
+
+export const POST = async ({ request }) => {
+    try {
+        var secrets = await client.listSecrets({
+            environment: "dev",
+            projectId: import.meta.env.INFISICAL_PROJECTID,
+            path: "/email",
+            includeImports: false
+        });
+        secrets = Object.fromEntries(secrets.map(item => [item.secretKey, item.secretValue]));
+        
+        const thisCuid = createId();
+        const data = await request.formData();
+        var message = {
+            from: `${data.get("username")} <${secrets["EMAIL"]}>`,
+            to: `Site Admin <${secrets["RECEIVER"]}>`,
+            subject: `${secrets["EMAIL_HEAD"]} | ${thisCuid}`,
+            text: `---\n${data.get("username")}\n${data.get("email")}\n---\n${data.get("message")}`,
+            html: `<p>---<br/>${data.get("username")}<br/>${data.get("email")}<br/>---<br/>${data.get("message")}</p>`,
+            envelope: {
+                from: `${data.get("username")} <${secrets["EMAIL"]}>`,
+                to: `Site Admin <${secrets["RECEIVER"]}>`,
+            }
+        }
+        var transport = nodemailer.createTransport({
+            host: secrets["SMTP_SERVER"],
+            port: secrets["SMTP_PORT"],
+            secure: secrets["SMTP_SECURITY"],
+            auth: {
+                user: secrets["EMAIL"],
+                pass: secrets["PASSWORD"]
+            }
+        });
+
+        var mailResponse = await transport.sendMail(message);
+        console.log(mailResponse)
+        return new Response(JSON.stringify({ message: "Success!" }), { status: 200 });
+
+    } catch (error) {
+        console.error("Error parsing form data:", error);
+        return new Response(JSON.stringify({ message: "Failed to parse form data" }), { status: 400 });
+    }
+};
+
+
+/*
+npm install --save @types/nodemailer
+npm install --save @types/nodemailer
+npm install --save @types/nodemailer
+npm install --save @types/nodemailer
+
+další řádka
+
+volná řádka
+další řádka
+asdasdasdasdasdad dlouhá řádka asdasdasda žádný enter tady asdsadadsas
+*/