function MainComponent() { const [formData, setFormData] = React.useState({ filmName: '', characterName: '', actorName: '', roleType: 'Main', email: '', phoneNumber: '', biography: '', headshot: null }); const [submitting, setSubmitting] = React.useState(false); const [response, setResponse] = React.useState(null); const handleChange = (e)=>{ const { name, type, value } = e.target; setFormData((prevFormData)=>({ ...prevFormData, [name]: type === 'file' ? e.target.files[0] : value })); }; const handleSubmit = async (e)=>{ e.preventDefault(); setSubmitting(true); const messages = [ { role: "system", content: `Film casting application for the role: ${formData.roleType}` }, { role: "user", content: `Film Name: ${formData.filmName}` }, { role: "user", content: `Character Name: ${formData.characterName}` }, { role: "user", content: `Actor Name: ${formData.actorName}` }, { role: "user", content: `Contact Email: ${formData.email}` }, { role: "user", content: `Phone Number: ${formData.phoneNumber}` }, { role: "user", content: `Biography: ${formData.biography}` } ]; try { const response = await fetch('/integrations/chat-gpt/conversationgpt4', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ messages, system_prompt: 'Review the casting application details', max_tokens: 2000 }) }); const data = await response.json(); setResponse(data.result); } catch (error) { console.error('Error submitting casting application:', error); } setSubmitting(false); }; const roleOptions = [ "Main", "Supporting", "Cameo" ]; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex flex-col items-center justify-center bg-[#f3f4f6] p-4", __source: { fileName: "", lineNumber: 83, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold text-[#121212] mb-8", __source: { fileName: "", lineNumber: 84, columnNumber: 7 }, __self: this }, "Film Casting Application"), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-xl bg-white rounded-lg shadow-md p-6", __source: { fileName: "", lineNumber: 85, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "space-y-4", __source: { fileName: "", lineNumber: 86, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-semibold text-[#121212] mb-4", __source: { fileName: "", lineNumber: 87, columnNumber: 11 }, __self: this }, "Casting and Contact Details"), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 91, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "email", className: "block text-sm font-medium text-[#121212]", __source: { fileName: "", lineNumber: 92, columnNumber: 13 }, __self: this }, "Contact Email"), /*#__PURE__*/ React.createElement("input", { type: "email", id: "email", name: "email", value: formData.email, onChange: handleChange, className: "mt-1 block w-full border border-[#cccccc] rounded-md py-2 px-3", placeholder: "Enter contact email", required: true, __source: { fileName: "", lineNumber: 93, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 96, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "phoneNumber", className: "block text-sm font-medium text-[#121212]", __source: { fileName: "", lineNumber: 97, columnNumber: 13 }, __self: this }, "Phone Number"), /*#__PURE__*/ React.createElement("input", { type: "tel", id: "phoneNumber", name: "phoneNumber", value: formData.phoneNumber, onChange: handleChange, className: "mt-1 block w-full border border-[#cccccc] rounded-md py-2 px-3", placeholder: "Enter phone number", required: true, __source: { fileName: "", lineNumber: 98, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 101, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "biography", className: "block text-sm font-medium text-[#121212]", __source: { fileName: "", lineNumber: 102, columnNumber: 13 }, __self: this }, "Biography"), /*#__PURE__*/ React.createElement("textarea", { id: "biography", name: "biography", value: formData.biography, onChange: handleChange, className: "mt-1 block w-full border border-[#cccccc] rounded-md py-2 px-3", rows: "4", placeholder: "Short biography", required: true, __source: { fileName: "", lineNumber: 103, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 106, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "headshot", className: "block text-sm font-medium text-[#121212]", __source: { fileName: "", lineNumber: 107, columnNumber: 13 }, __self: this }, "Headshot"), /*#__PURE__*/ React.createElement("input", { type: "file", id: "headshot", name: "headshot", onChange: handleChange, className: "mt-1 block w-full border border-[#cccccc] rounded-md py-2 px-3", required: true, __source: { fileName: "", lineNumber: 108, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "w-full bg-[#4f46e5] text-white rounded-md py-2 px-4 hover:bg-[#4338ca]", disabled: submitting, __source: { fileName: "", lineNumber: 113, columnNumber: 11 }, __self: this }, submitting ? 'Submitting...' : 'Submit Application')), response && /*#__PURE__*/ React.createElement("div", { className: "mt-4 p-4 bg-[#e0e7ff] rounded-md", __source: { fileName: "", lineNumber: 117, columnNumber: 22 }, __self: this }, response))); }