function MainComponent() { const [userType, setUserType] = useState(null); const [formData, setFormData] = useState({ name: "", email: "", phone: "", address: "", experience: "", availability: "", hasMedicaid: "", message: "" }); const [error, setError] = useState(null); const [loading, setLoading] = useState(false); const { signInWithGoogle } = useAuth(); const handleGoogleSignup = async ()=>{ try { setLoading(true); setError(null); // Track signup attempt with Google if (window.gaTrack) { window.gaTrack.event("signup_attempt", { category: "Authentication", label: "Google", method: "Google" }); } await signInWithGoogle({ callbackUrl: "/", redirect: true }); // Track successful signup with Google if (window.gaTrack) { window.gaTrack.conversion.signup("google_user"); } } catch (error) { setError("Failed to sign in with Google. Please try again."); // Track failed signup if (window.gaTrack) { window.gaTrack.event("signup_error", { category: "Authentication", label: "Google", error: error.message }); } setLoading(false); } }; const handleSubmit = async (e)=>{ e.preventDefault(); setLoading(true); setError(null); try { // Track signup attempt if (window.gaTrack) { window.gaTrack.event("signup_attempt", { category: "Authentication", label: "Email", method: "Email", user_type: userType }); } const response = await fetch("/api/signup", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ ...formData, requestType: userType, careType: userType === "Client" ? "daily_living" : undefined }) }); if (!response.ok) { throw new Error("Failed to submit registration"); } // Track successful signup and set user properties if (window.gaTrack) { // Track signup conversion window.gaTrack.conversion.signup(userType); // Set user properties window.gaTrack.customMetrics.setUserProperties({ userType: userType, subscriptionStatus: "free" }); // If it's a care request, track as lead if (userType === "Client") { window.gaTrack.conversion.careRequest({ careType: "daily_living", estimatedValue: 1000 }); } } window.location.href = "/"; } catch (error) { setError("Failed to complete registration. Please try again."); // Track failed signup if (window.gaTrack) { window.gaTrack.event("signup_error", { category: "Authentication", label: "Email", error: error.message, user_type: userType }); } } finally{ setLoading(false); } }; const handleChange = (e)=>{ const { name, value } = e.target; setFormData({ ...formData, [name]: value }); // Track form field completion if (value && window.gaTrack) { window.gaTrack.event("form_field_complete", { category: "Form", label: name, user_type: userType }); } }; const handleUserTypeSelect = (type)=>{ setUserType(type); if (window.gaTrack) { window.gaTrack.event("user_type_selected", { category: "Form", label: type }); } }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-br from-blue-50 to-indigo-50 py-12 px-4 sm:px-6 lg:px-8", __source: { fileName: "", lineNumber: 153, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-md mx-auto", __source: { fileName: "", lineNumber: 154, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mb-8", __source: { fileName: "", lineNumber: 155, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-3xl font-bold text-gray-900", __source: { fileName: "", lineNumber: 156, columnNumber: 11 }, __self: this }, "Create Account"), /*#__PURE__*/ React.createElement("p", { className: "mt-2 text-gray-600", __source: { fileName: "", lineNumber: 157, columnNumber: 11 }, __self: this }, "Join Hayaat Home Care today")), /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-xl shadow-xl p-8", __source: { fileName: "", lineNumber: 160, columnNumber: 9 }, __self: this }, !userType ? /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 162, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleGoogleSignup, disabled: loading, className: "w-full flex items-center justify-center px-4 py-3 border border-gray-300 rounded-lg shadow-sm text-base font-medium text-gray-700 bg-white hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-[#357AFF]", __source: { fileName: "", lineNumber: 163, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fab fa-google mr-2", __source: { fileName: "", lineNumber: 168, columnNumber: 17 }, __self: this }), "Continue with Google"), /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 172, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 flex items-center", __source: { fileName: "", lineNumber: 173, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full border-t border-gray-300", __source: { fileName: "", lineNumber: 174, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "relative flex justify-center text-sm", __source: { fileName: "", lineNumber: 176, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "px-2 bg-white text-gray-500", __source: { fileName: "", lineNumber: 177, columnNumber: 19 }, __self: this }, "Or choose your role"))), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 183, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleUserTypeSelect("Caregiver"), className: "flex flex-col items-center p-4 border-2 rounded-lg hover:border-[#357AFF] transition-colors", __source: { fileName: "", lineNumber: 184, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-hand-holding-heart text-2xl mb-2 text-[#357AFF]", __source: { fileName: "", lineNumber: 188, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 189, columnNumber: 19 }, __self: this }, "Caregiver")), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleUserTypeSelect("Client"), className: "flex flex-col items-center p-4 border-2 rounded-lg hover:border-[#357AFF] transition-colors", __source: { fileName: "", lineNumber: 191, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user text-2xl mb-2 text-[#357AFF]", __source: { fileName: "", lineNumber: 195, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 196, columnNumber: 19 }, __self: this }, "Client")))) : /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "space-y-6", __source: { fileName: "", lineNumber: 201, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 202, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 203, columnNumber: 17 }, __self: this }, "Full Name"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "name", required: true, value: formData.name, onChange: handleChange, className: "mt-1 block w-full border-gray-300 rounded-lg shadow-sm focus:ring-[#357AFF] focus:border-[#357AFF]", __source: { fileName: "", lineNumber: 206, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 216, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 217, columnNumber: 17 }, __self: this }, "Email"), /*#__PURE__*/ React.createElement("input", { type: "email", name: "email", required: true, value: formData.email, onChange: handleChange, className: "mt-1 block w-full border-gray-300 rounded-lg shadow-sm focus:ring-[#357AFF] focus:border-[#357AFF]", __source: { fileName: "", lineNumber: 220, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 230, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 231, columnNumber: 17 }, __self: this }, "Phone"), /*#__PURE__*/ React.createElement("input", { type: "tel", name: "phone", required: true, value: formData.phone, onChange: handleChange, className: "mt-1 block w-full border-gray-300 rounded-lg shadow-sm focus:ring-[#357AFF] focus:border-[#357AFF]", __source: { fileName: "", lineNumber: 234, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 244, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 245, columnNumber: 17 }, __self: this }, "Address"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "address", required: true, value: formData.address, onChange: handleChange, className: "mt-1 block w-full border-gray-300 rounded-lg shadow-sm focus:ring-[#357AFF] focus:border-[#357AFF]", __source: { fileName: "", lineNumber: 248, columnNumber: 17 }, __self: this })), userType === "Caregiver" && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 260, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 261, columnNumber: 21 }, __self: this }, "Years of Experience"), /*#__PURE__*/ React.createElement("input", { type: "number", name: "experience", required: true, value: formData.experience, onChange: handleChange, className: "mt-1 block w-full border-gray-300 rounded-lg shadow-sm focus:ring-[#357AFF] focus:border-[#357AFF]", __source: { fileName: "", lineNumber: 264, columnNumber: 21 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 274, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 275, columnNumber: 21 }, __self: this }, "Availability"), /*#__PURE__*/ React.createElement("select", { name: "availability", required: true, value: formData.availability, onChange: handleChange, className: "mt-1 block w-full border-gray-300 rounded-lg shadow-sm focus:ring-[#357AFF] focus:border-[#357AFF]", __source: { fileName: "", lineNumber: 278, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 285, columnNumber: 23 }, __self: this }, "Select availability"), /*#__PURE__*/ React.createElement("option", { value: "full-time", __source: { fileName: "", lineNumber: 286, columnNumber: 23 }, __self: this }, "Full Time"), /*#__PURE__*/ React.createElement("option", { value: "part-time", __source: { fileName: "", lineNumber: 287, columnNumber: 23 }, __self: this }, "Part Time"), /*#__PURE__*/ React.createElement("option", { value: "weekends", __source: { fileName: "", lineNumber: 288, columnNumber: 23 }, __self: this }, "Weekends Only")))), userType === "Client" && /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 295, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 296, columnNumber: 19 }, __self: this }, "Do you have Medicaid?"), /*#__PURE__*/ React.createElement("select", { name: "hasMedicaid", required: true, value: formData.hasMedicaid, onChange: handleChange, className: "mt-1 block w-full border-gray-300 rounded-lg shadow-sm focus:ring-[#357AFF] focus:border-[#357AFF]", __source: { fileName: "", lineNumber: 299, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 306, columnNumber: 21 }, __self: this }, "Please select"), /*#__PURE__*/ React.createElement("option", { value: "yes", __source: { fileName: "", lineNumber: 307, columnNumber: 21 }, __self: this }, "Yes"), /*#__PURE__*/ React.createElement("option", { value: "no", __source: { fileName: "", lineNumber: 308, columnNumber: 21 }, __self: this }, "No"), /*#__PURE__*/ React.createElement("option", { value: "pending", __source: { fileName: "", lineNumber: 309, columnNumber: 21 }, __self: this }, "Application Pending"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 314, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 315, columnNumber: 17 }, __self: this }, "Additional Information"), /*#__PURE__*/ React.createElement("textarea", { name: "message", rows: "3", value: formData.message, onChange: handleChange, className: "mt-1 block w-full border-gray-300 rounded-lg shadow-sm focus:ring-[#357AFF] focus:border-[#357AFF]", placeholder: userType === "Client" ? "Please describe what kind of daily living activities you need assistance with" : "Any additional information you'd like to share", __source: { fileName: "", lineNumber: 318, columnNumber: 17 }, __self: this })), error && /*#__PURE__*/ React.createElement("div", { className: "rounded-lg bg-red-50 p-3 text-sm text-red-500", __source: { fileName: "", lineNumber: 333, columnNumber: 17 }, __self: this }, error), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 338, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "button", onClick: ()=>setUserType(null), className: "flex-1 px-4 py-3 text-base font-medium text-[#357AFF] border border-[#357AFF] rounded-lg hover:bg-blue-50", __source: { fileName: "", lineNumber: 339, columnNumber: 17 }, __self: this }, "Back"), /*#__PURE__*/ React.createElement("button", { type: "submit", disabled: loading, className: "flex-1 px-4 py-3 text-base font-medium text-white bg-[#357AFF] rounded-lg hover:bg-[#2E69DE] disabled:opacity-50", __source: { fileName: "", lineNumber: 346, columnNumber: 17 }, __self: this }, loading ? "Processing..." : "Complete Signup")))))); }