function MainComponent() { const [searchQuery, setSearchQuery] = useState(""); const [searchResults, setSearchResults] = useState([]); const [searchError, setSearchError] = useState(null); const [loading, setLoading] = useState(false); const [selectedLocation, setSelectedLocation] = useState(""); const [instructors, setInstructors] = useState([]); // Course enquiry form state const [enquiryForm, setEnquiryForm] = useState({ name: "", phone: "", email: "", postcode: "", preferredTransmission: "", preferredGender: "", preferredStartDate: "", preferredCompletionDate: "", preferredDays: [], preferredTimes: [], message: "" }); // Instructor application form state const [applicationForm, setApplicationForm] = useState({ name: "", phone: "", email: "", postcode: "", experienceYears: "", transmissionTypes: [], preferredAreas: [], message: "" }); const handleSearch = useCallback(async ()=>{ setLoading(true); setSearchError(null); try { const response = await fetch(`/integrations/google-place-autocomplete/autocomplete/json?input=${searchQuery}&radius=500`); if (!response.ok) { throw new Error("Failed to fetch locations"); } const data = await response.json(); setSearchResults(data.predictions); } catch (error) { setSearchError("Unable to search locations. Please try again."); console.error(error); } finally{ setLoading(false); } }, [ searchQuery ]); const handleLocationSelect = useCallback(async (location)=>{ setSelectedLocation(location); setSearchResults([]); setSearchQuery(location); try { const response = await fetch("/api/search-instructors", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ location: location, transmission: enquiryForm.preferredTransmission, gender: enquiryForm.preferredGender }) }); if (!response.ok) { throw new Error("Failed to fetch instructors"); } const data = await response.json(); if (data.error) { throw new Error(data.error); } setInstructors(data.instructors); } catch (error) { setSearchError("Failed to find instructors. Please try again."); console.error(error); } }, [ enquiryForm.preferredTransmission, enquiryForm.preferredGender ]); const handleEnquirySubmit = async (e)=>{ e.preventDefault(); try { const response = await fetch("/api/submit-course-enquiry", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(enquiryForm) }); if (!response.ok) { throw new Error("Failed to submit enquiry"); } const data = await response.json(); if (data.error) { throw new Error(data.error); } alert("Thank you for your enquiry. We will contact you soon!"); setEnquiryForm({ name: "", phone: "", email: "", postcode: "", preferredTransmission: "", preferredGender: "", preferredStartDate: "", preferredCompletionDate: "", preferredDays: [], preferredTimes: [], message: "" }); } catch (error) { alert("Failed to submit enquiry. Please try again."); console.error(error); } }; const handleApplicationSubmit = async (e)=>{ e.preventDefault(); try { const response = await fetch("/api/submit-instructor-application", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(applicationForm) }); if (!response.ok) { throw new Error("Failed to submit application"); } const data = await response.json(); if (data.error) { throw new Error(data.error); } alert("Thank you for your application. We will contact you soon!"); setApplicationForm({ name: "", phone: "", email: "", postcode: "", experienceYears: "", transmissionTypes: [], preferredAreas: [], message: "" }); } catch (error) { alert("Failed to submit application. Please try again."); console.error(error); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-white", __source: { fileName: "", lineNumber: 171, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-[#1a237e] text-white", __source: { fileName: "", lineNumber: 172, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4 py-6 flex justify-between items-center", __source: { fileName: "", lineNumber: 173, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl md:text-3xl font-bold font-montserrat", __source: { fileName: "", lineNumber: 174, columnNumber: 11 }, __self: this }, "Pass Plus School of Motoring"), /*#__PURE__*/ React.createElement("nav", { __source: { fileName: "", lineNumber: 177, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { className: "flex space-x-6 font-roboto", __source: { fileName: "", lineNumber: 178, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 179, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "#search", className: "hover:text-[#90caf9]", __source: { fileName: "", lineNumber: 180, columnNumber: 17 }, __self: this }, "Find Instructor")), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 184, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "#apply", className: "hover:text-[#90caf9]", __source: { fileName: "", lineNumber: 185, columnNumber: 17 }, __self: this }, "Become Instructor")))))), /*#__PURE__*/ React.createElement("section", { id: "search", className: "bg-[#e8eaf6] py-20", __source: { fileName: "", lineNumber: 194, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4", __source: { fileName: "", lineNumber: 195, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-4xl md:text-5xl font-bold mb-6 font-montserrat text-[#1a237e] text-center", __source: { fileName: "", lineNumber: 196, columnNumber: 11 }, __self: this }, "Find Your Perfect Driving Instructor"), /*#__PURE__*/ React.createElement("div", { className: "max-w-2xl mx-auto bg-white rounded-lg shadow-lg p-6", __source: { fileName: "", lineNumber: 199, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleEnquirySubmit, className: "space-y-6", __source: { fileName: "", lineNumber: 200, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 201, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "Enter your location", className: "w-full p-4 rounded-lg border border-[#1a237e] font-roboto", value: searchQuery, onChange: (e)=>setSearchQuery(e.target.value), onKeyUp: ()=>searchQuery.length > 2 && handleSearch(), __source: { fileName: "", lineNumber: 202, columnNumber: 17 }, __self: this }), searchResults.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-lg p-4", __source: { fileName: "", lineNumber: 211, columnNumber: 19 }, __self: this }, searchResults.map((result)=>/*#__PURE__*/ React.createElement("div", { key: result.place_id, className: "p-2 hover:bg-[#e8eaf6] cursor-pointer rounded", onClick: ()=>handleLocationSelect(result.description), __source: { fileName: "", lineNumber: 213, columnNumber: 23 }, __self: this }, result.description))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 224, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "Your Name", className: "p-4 rounded-lg border border-[#1a237e] font-roboto", value: enquiryForm.name, onChange: (e)=>setEnquiryForm({ ...enquiryForm, name: e.target.value }), __source: { fileName: "", lineNumber: 225, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "tel", placeholder: "Phone Number", className: "p-4 rounded-lg border border-[#1a237e] font-roboto", value: enquiryForm.phone, onChange: (e)=>setEnquiryForm({ ...enquiryForm, phone: e.target.value }), __source: { fileName: "", lineNumber: 234, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("input", { type: "email", placeholder: "Email (optional)", className: "w-full p-4 rounded-lg border border-[#1a237e] font-roboto", value: enquiryForm.email, onChange: (e)=>setEnquiryForm({ ...enquiryForm, email: e.target.value }), __source: { fileName: "", lineNumber: 245, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 255, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("select", { className: "p-4 rounded-lg border border-[#1a237e] font-roboto", value: enquiryForm.preferredTransmission, onChange: (e)=>setEnquiryForm({ ...enquiryForm, preferredTransmission: e.target.value }), __source: { fileName: "", lineNumber: 256, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 266, columnNumber: 21 }, __self: this }, "Select Transmission"), /*#__PURE__*/ React.createElement("option", { value: "Manual", __source: { fileName: "", lineNumber: 267, columnNumber: 21 }, __self: this }, "Manual"), /*#__PURE__*/ React.createElement("option", { value: "Automatic", __source: { fileName: "", lineNumber: 268, columnNumber: 21 }, __self: this }, "Automatic")), /*#__PURE__*/ React.createElement("select", { className: "p-4 rounded-lg border border-[#1a237e] font-roboto", value: enquiryForm.preferredGender, onChange: (e)=>setEnquiryForm({ ...enquiryForm, preferredGender: e.target.value }), __source: { fileName: "", lineNumber: 271, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 281, columnNumber: 21 }, __self: this }, "Instructor Gender (Optional)"), /*#__PURE__*/ React.createElement("option", { value: "Male", __source: { fileName: "", lineNumber: 282, columnNumber: 21 }, __self: this }, "Male"), /*#__PURE__*/ React.createElement("option", { value: "Female", __source: { fileName: "", lineNumber: 283, columnNumber: 21 }, __self: this }, "Female"))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 287, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "date", className: "p-4 rounded-lg border border-[#1a237e] font-roboto", value: enquiryForm.preferredStartDate, onChange: (e)=>setEnquiryForm({ ...enquiryForm, preferredStartDate: e.target.value }), __source: { fileName: "", lineNumber: 288, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "date", className: "p-4 rounded-lg border border-[#1a237e] font-roboto", value: enquiryForm.preferredCompletionDate, onChange: (e)=>setEnquiryForm({ ...enquiryForm, preferredCompletionDate: e.target.value }), __source: { fileName: "", lineNumber: 299, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("textarea", { placeholder: "Additional requirements or questions", className: "w-full p-4 rounded-lg border border-[#1a237e] font-roboto", rows: 4, value: enquiryForm.message, onChange: (e)=>setEnquiryForm({ ...enquiryForm, message: e.target.value }), __source: { fileName: "", lineNumber: 312, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-[#1a237e] text-white px-8 py-4 rounded-lg font-roboto hover:bg-[#283593] transition-colors", __source: { fileName: "", lineNumber: 323, columnNumber: 15 }, __self: this }, "Submit Enquiry"))), instructors.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "mt-8", __source: { fileName: "", lineNumber: 333, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-2xl font-bold mb-4 font-montserrat text-[#1a237e]", __source: { fileName: "", lineNumber: 334, columnNumber: 15 }, __self: this }, "Available Instructors"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6", __source: { fileName: "", lineNumber: 337, columnNumber: 15 }, __self: this }, instructors.map((instructor)=>/*#__PURE__*/ React.createElement("div", { key: instructor.id, className: "bg-white rounded-lg shadow-lg p-6", __source: { fileName: "", lineNumber: 339, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "text-xl font-bold mb-2 font-montserrat", __source: { fileName: "", lineNumber: 343, columnNumber: 21 }, __self: this }, instructor.name), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mb-2", __source: { fileName: "", lineNumber: 346, columnNumber: 21 }, __self: this }, "Experience: ", instructor.experience_years, " years"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mb-2", __source: { fileName: "", lineNumber: 349, columnNumber: 21 }, __self: this }, "Rating: ", instructor.rating, " ⭐"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mb-2", __source: { fileName: "", lineNumber: 352, columnNumber: 21 }, __self: this }, "Transmission: ", instructor.transmission_types.join(", ")), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 355, columnNumber: 21 }, __self: this }, instructor.bio))))))), /*#__PURE__*/ React.createElement("section", { id: "apply", className: "py-20 bg-white", __source: { fileName: "", lineNumber: 364, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4", __source: { fileName: "", lineNumber: 365, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl md:text-4xl font-bold mb-12 text-center font-montserrat text-[#1a237e]", __source: { fileName: "", lineNumber: 366, columnNumber: 11 }, __self: this }, "Join Our Team - No Franchise Fees!"), /*#__PURE__*/ React.createElement("div", { className: "max-w-2xl mx-auto bg-white rounded-lg shadow-lg p-6", __source: { fileName: "", lineNumber: 369, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleApplicationSubmit, className: "space-y-6", __source: { fileName: "", lineNumber: 370, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-6", __source: { fileName: "", lineNumber: 371, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "Full Name", className: "p-4 rounded-lg border border-[#1a237e] font-roboto", value: applicationForm.name, onChange: (e)=>setApplicationForm({ ...applicationForm, name: e.target.value }), __source: { fileName: "", lineNumber: 372, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "tel", placeholder: "Phone Number", className: "p-4 rounded-lg border border-[#1a237e] font-roboto", value: applicationForm.phone, onChange: (e)=>setApplicationForm({ ...applicationForm, phone: e.target.value }), __source: { fileName: "", lineNumber: 384, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("input", { type: "email", placeholder: "Email Address", className: "w-full p-4 rounded-lg border border-[#1a237e] font-roboto", value: applicationForm.email, onChange: (e)=>setApplicationForm({ ...applicationForm, email: e.target.value }), __source: { fileName: "", lineNumber: 398, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "Postcode", className: "w-full p-4 rounded-lg border border-[#1a237e] font-roboto", value: applicationForm.postcode, onChange: (e)=>setApplicationForm({ ...applicationForm, postcode: e.target.value }), __source: { fileName: "", lineNumber: 411, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", placeholder: "Years of Experience", className: "w-full p-4 rounded-lg border border-[#1a237e] font-roboto", value: applicationForm.experienceYears, onChange: (e)=>setApplicationForm({ ...applicationForm, experienceYears: e.target.value }), __source: { fileName: "", lineNumber: 424, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 437, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-[#1a237e]", __source: { fileName: "", lineNumber: 438, columnNumber: 17 }, __self: this }, "Transmission Types"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-4", __source: { fileName: "", lineNumber: 439, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "flex items-center", __source: { fileName: "", lineNumber: 440, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", checked: applicationForm.transmissionTypes.includes("Manual"), onChange: (e)=>{ const types = e.target.checked ? [ ...applicationForm.transmissionTypes, "Manual" ] : applicationForm.transmissionTypes.filter((t)=>t !== "Manual"); setApplicationForm({ ...applicationForm, transmissionTypes: types }); }, className: "mr-2", __source: { fileName: "", lineNumber: 441, columnNumber: 21 }, __self: this }), "Manual"), /*#__PURE__*/ React.createElement("label", { className: "flex items-center", __source: { fileName: "", lineNumber: 461, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", checked: applicationForm.transmissionTypes.includes("Automatic"), onChange: (e)=>{ const types = e.target.checked ? [ ...applicationForm.transmissionTypes, "Automatic" ] : applicationForm.transmissionTypes.filter((t)=>t !== "Automatic"); setApplicationForm({ ...applicationForm, transmissionTypes: types }); }, className: "mr-2", __source: { fileName: "", lineNumber: 462, columnNumber: 21 }, __self: this }), "Automatic"))), /*#__PURE__*/ React.createElement("textarea", { placeholder: "Tell us about your teaching experience and preferred areas", rows: 4, className: "w-full p-4 rounded-lg border border-[#1a237e] font-roboto", value: applicationForm.message, onChange: (e)=>setApplicationForm({ ...applicationForm, message: e.target.value }), __source: { fileName: "", lineNumber: 485, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-[#1a237e] text-white px-8 py-4 rounded-lg font-roboto hover:bg-[#283593] transition-colors", __source: { fileName: "", lineNumber: 498, columnNumber: 15 }, __self: this }, "Submit Application"))))), /*#__PURE__*/ React.createElement("footer", { className: "bg-[#1a237e] text-white py-8", __source: { fileName: "", lineNumber: 509, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4 text-center font-roboto", __source: { fileName: "", lineNumber: 510, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 511, columnNumber: 11 }, __self: this }, "Based in Bolton, serving all of UK"), /*#__PURE__*/ React.createElement("p", { className: "mt-2", __source: { fileName: "", lineNumber: 512, columnNumber: 11 }, __self: this }, "© 2025 Pass Plus School of Motoring. All rights reserved.")))); }