Base44 lead form with an email for every entry

// src/components/LeadForm.jsx  (Base44 front ends use React, Vite, Tailwind and shadcn/ui)
// Adjust the "@/components/ui/..." paths if your project uses different ones.
import { useState } from "react";
import { Button } from "@/components/ui/button";
import { Input } from "@/components/ui/input";
import { Textarea } from "@/components/ui/textarea";

export default function LeadForm() {
  const [sending, setSending] = useState(false);
  const [msg, setMsg] = useState(null);

  async function handleSubmit(e) {
    e.preventDefault();
    const form = e.currentTarget;
    setSending(true);

    const reply = await fetch("https://formbold.com/s/FORM_ID", {
      method: "POST",
      headers: { "Content-Type": "application/json", Accept: "application/json" },
      body: JSON.stringify(Object.fromEntries(new FormData(form))),
    })
      .then(async (r) => ({ ok: r.ok, data: await r.json().catch(() => ({})) }))
      .catch(() => ({ ok: false, data: {} }));

    setSending(false);
    if (reply.ok) {
      form.reset();
      setMsg({ tone: "good", text: "You're on the list. We'll be in touch this week." });
    } else {
      setMsg({ tone: "bad", text: reply.data.message || "Something blocked the request." });
    }
  }

  return (
    <form onSubmit={handleSubmit} className="space-y-3">
      <Input name="name" placeholder="Name" required />
      <Input name="email" type="email" placeholder="Email" required />
      <Textarea name="message" placeholder="Anything we should know?" />
      <Button type="submit" disabled={sending} className="w-full">
        {sending ? "Sending..." : "Request access"}
      </Button>
      {msg && (
        <p className={msg.tone === "good" ? "text-green-600 text-sm" : "text-red-600 text-sm"}>{msg.text}</p>
      )}
    </form>
  );
}