function MainComponent() { const [formData, setFormData] = useState({ name: "", email: "", phone: "", service_needed: "", description: "" }); const [error, setError] = useState(""); const [success, setSuccess] = useState(false); const [loading, setLoading] = useState(false); const handleSubmit = async (e)=>{ e.preventDefault(); setLoading(true); setError(""); setSuccess(false); try { const response = await fetch("/api/leads/create", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(formData) }); if (!response.ok) { throw new Error(`Error: ${response.status}`); } setSuccess(true); setFormData({ name: "", email: "", phone: "", service_needed: "", description: "" }); } catch (err) { setError("Something went wrong. Please try again."); console.error(err); } finally{ setLoading(false); } }; const handleChange = (e)=>{ setFormData((prev)=>({ ...prev, [e.target.name]: e.target.value })); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-50 py-12 px-4 sm:px-6 lg:px-8", __source: { fileName: "", lineNumber: 52, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-md mx-auto bg-white rounded-lg shadow-md p-8", __source: { fileName: "", lineNumber: 53, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-bold text-center mb-8 font-roboto text-gray-900", __source: { fileName: "", lineNumber: 54, columnNumber: 9 }, __self: this }, "Contact Us"), success ? /*#__PURE__*/ React.createElement("div", { className: "bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded mb-4", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, "Thank you for your message! We'll get back to you soon.") : /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "space-y-6", __source: { fileName: "", lineNumber: 63, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 65, columnNumber: 15 }, __self: this }, "Name"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "name", required: true, value: formData.name, onChange: handleChange, className: "mt-1 block w-full rounded-md border border-gray-300 px-3 py-2 focus:border-blue-500 focus:outline-none", __source: { fileName: "", lineNumber: 68, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 77, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 78, columnNumber: 15 }, __self: this }, "Email"), /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", required: true, value: formData.email, onChange: handleChange, className: "mt-1 block w-full rounded-md border border-gray-300 px-3 py-2 focus:border-blue-500 focus:outline-none", __source: { fileName: "", lineNumber: 81, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 90, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 91, columnNumber: 15 }, __self: this }, "Phone"), /*#__PURE__*/ React.createElement("input", { type: "tel", name: "phone", required: true, value: formData.phone, onChange: handleChange, className: "mt-1 block w-full rounded-md border border-gray-300 px-3 py-2 focus:border-blue-500 focus:outline-none", __source: { fileName: "", lineNumber: 94, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 104, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 105, columnNumber: 15 }, __self: this }, "Service Needed"), /*#__PURE__*/ React.createElement("select", { name: "service_needed", required: true, value: formData.service_needed, onChange: handleChange, className: "mt-1 block w-full rounded-md border border-gray-300 px-3 py-2 focus:border-blue-500 focus:outline-none", __source: { fileName: "", lineNumber: 108, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 115, columnNumber: 17 }, __self: this }, "Select a service"), /*#__PURE__*/ React.createElement("option", { value: "Home Repairs", __source: { fileName: "", lineNumber: 116, columnNumber: 17 }, __self: this }, "Home Repairs"), /*#__PURE__*/ React.createElement("option", { value: "Carpentry", __source: { fileName: "", lineNumber: 117, columnNumber: 17 }, __self: this }, "Carpentry"), /*#__PURE__*/ React.createElement("option", { value: "Painting", __source: { fileName: "", lineNumber: 118, columnNumber: 17 }, __self: this }, "Painting"), /*#__PURE__*/ React.createElement("option", { value: "Assembly", __source: { fileName: "", lineNumber: 119, columnNumber: 17 }, __self: this }, "Assembly"), /*#__PURE__*/ React.createElement("option", { value: "Burglar Bars", __source: { fileName: "", lineNumber: 120, columnNumber: 17 }, __self: this }, "Burglar Bars"), /*#__PURE__*/ React.createElement("option", { value: "Steel Gates", __source: { fileName: "", lineNumber: 121, columnNumber: 17 }, __self: this }, "Steel Gates"), /*#__PURE__*/ React.createElement("option", { value: "Pressure Washing", __source: { fileName: "", lineNumber: 122, columnNumber: 17 }, __self: this }, "Pressure Washing"), /*#__PURE__*/ React.createElement("option", { value: "Vinyl Wrapping", __source: { fileName: "", lineNumber: 123, columnNumber: 17 }, __self: this }, "Vinyl Wrapping"), /*#__PURE__*/ React.createElement("option", { value: "Landscaping", __source: { fileName: "", lineNumber: 124, columnNumber: 17 }, __self: this }, "Landscaping"), /*#__PURE__*/ React.createElement("option", { value: "Blinds", __source: { fileName: "", lineNumber: 125, columnNumber: 17 }, __self: this }, "Blinds"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 129, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 130, columnNumber: 15 }, __self: this }, "Description"), /*#__PURE__*/ React.createElement("textarea", { name: "description", required: true, value: formData.description, onChange: handleChange, rows: "4", className: "mt-1 block w-full rounded-md border border-gray-300 px-3 py-2 focus:border-blue-500 focus:outline-none", __source: { fileName: "", lineNumber: 133, columnNumber: 15 }, __self: this })), error && /*#__PURE__*/ React.createElement("div", { className: "bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded", __source: { fileName: "", lineNumber: 144, columnNumber: 15 }, __self: this }, error), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: loading, className: "w-full bg-blue-600 text-white py-2 px-4 rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 disabled:opacity-50", __source: { fileName: "", lineNumber: 149, columnNumber: 13 }, __self: this }, loading ? "Sending..." : "Send Message")))); }