added form submission

docker-compose.yml

@@ -1,24 +0,0 @@
-version: "3.8"
-services:
-  nextjs:
-    build: .
-    deploy:
-      update_config:
-        parallelism: 1
-        delay: 5s
-        order: start-first
-    container_name: pablo.shortman.me
-    restart: always
-    labels:
-      - "traefik.enable=true"
-      - "traefik.http.routers.pablo-shortman-me.rule=Host(`pablo.shortman.me`)"
-      - "traefik.http.routers.pablo-shortman-me.entrypoints=websecure"
-      - "traefik.http.services.pablo-shortman-me.loadbalancer.server.port=3000"
-      - "traefik.http.routers.pablo-shortman-me.tls.certresolver=myresolver"
-    expose:
-      - "3000"
-    networks:
-      - webproxy
-networks:
-  webproxy:
-    external: true

src/app/(PAGES)/contact/page.tsx

@@ -2,7 +2,11 @@ import React from "react";
 import Contact from "@/components/setions/contact";
 
 function ContactPage() {
-  return <Contact />;
+  return (
+    <div className="pt-12">
+      <Contact />
+    </div>
+  );
 }
 
 export default ContactPage;

src/components/contact-form.tsx

@@ -24,6 +24,7 @@ import {
   SelectValue,
 } from "@/components/ui/select";
 import { cn } from "@/lib/utils";
+import { sendDiscordNotification } from "@/lib/actions";
 
 const formSchema = z.object({
   name: z.string().min(2).max(50),
@@ -39,10 +40,16 @@ function ContactForm() {
   });
 
   // 2. Define a submit handler.
-  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({
+    email,
+    message,
+    name,
+    budget,
+  }: z.infer<typeof formSchema>) {
+    await sendDiscordNotification(
+      `📬 **New Lead Submission**\n*Source*: pablo.shortman.me \n**Name**: ${name}\n**Email**: ${email}\n**Message**: ${message} \n**Budget**: ${budget} $`
+    );
+    form.reset();
   }
 
   return (
@@ -98,8 +105,8 @@ function ContactForm() {
                     <SelectValue placeholder="Select your Budget" />
                   </SelectTrigger>
                   <SelectContent>
-                    <SelectItem value="< €2k">{"less then $2k"}</SelectItem>
-                    <SelectItem value="> €4k">{"more then $4k"}</SelectItem>
+                    <SelectItem value="< €2k">{"less then $1k"}</SelectItem>
+                    <SelectItem value="> €4k">{"more then $3k"}</SelectItem>
                     <SelectItem value="> €6k">{"more then $6k"}</SelectItem>
                   </SelectContent>
                 </Select>

src/lib/actions.ts

@@ -0,0 +1,13 @@
+"use server";
+
+export async function sendDiscordNotification(message: string) {
+  const webhookUrl = process.env.DISCORD_WEBHOOK_URL;
+
+  await fetch(webhookUrl!, {
+    method: "POST",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({
+      content: message,
+    }),
+  });
+}