function MainComponent() { const [formData, setFormData] = React.useState({ title: '', description: '', category: '', tags: '', image: null }); const [preview, setPreview] = React.useState(null); const [message, setMessage] = React.useState(''); const [loading, setLoading] = React.useState(false); const handleInputChange = (e)=>{ const { name, value } = e.target; setFormData((prev)=>({ ...prev, [name]: value })); }; const handleImageUpload = (e)=>{ const file = e.target.files[0]; if (file) { const reader = new FileReader(); reader.onloadend = ()=>{ setFormData((prev)=>({ ...prev, image: reader.result })); }; reader.readAsDataURL(file); } }; const handleSubmit = async (e)=>{ e.preventDefault(); if (!formData.title || !formData.description || !formData.category) { setMessage('Please fill in all required fields.'); return; } setLoading(true); try { const response = await fetch('/api/db/unified-marketplace-users-90', { method: 'POST', body: JSON.stringify({ query: "INSERT INTO `posted_data` (id, tags, image, title, category, created_at, description) VALUES (?, ?, ?, ?, ?, ?, ?)", values: [ crypto.randomUUID(), formData.tags, formData.image, formData.title, formData.category, new Date().toISOString(), formData.description ] }) }); if (response.ok) { setMessage('Post submitted successfully!'); setFormData({ title: '', description: '', category: '', tags: '', image: null }); setPreview(null); } else { throw new Error('Submission failed'); } } catch (error) { setMessage('Error submitting post. Please try again.'); } setLoading(false); }; const handleClear = ()=>{ setFormData({ title: '', description: '', category: '', tags: '', image: null }); setPreview(null); setMessage(''); }; React.useEffect(()=>{ setPreview(formData); }, [ formData ]); return /*#__PURE__*/ React.createElement("div", { className: "container mx-auto p-4 font-sans", __source: { fileName: "", lineNumber: 78, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold mb-6", __source: { fileName: "", lineNumber: 79, columnNumber: 7 }, __self: this }, "Submit New Post"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "space-y-4", __source: { fileName: "", lineNumber: 80, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 81, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "title", className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 82, columnNumber: 11 }, __self: this }, "Title"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "title", name: "title", value: formData.title, onChange: handleInputChange, placeholder: "Enter the title here", className: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50", required: true, __source: { fileName: "", lineNumber: 83, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 94, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "description", className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 95, columnNumber: 11 }, __self: this }, "Description"), /*#__PURE__*/ React.createElement("textarea", { id: "description", name: "description", value: formData.description, onChange: handleInputChange, placeholder: "Enter a brief description", rows: "4", className: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50", required: true, __source: { fileName: "", lineNumber: 96, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 107, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "category", className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 108, columnNumber: 11 }, __self: this }, "Category"), /*#__PURE__*/ React.createElement("select", { id: "category", name: "category", value: formData.category, onChange: handleInputChange, className: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50", required: true, __source: { fileName: "", lineNumber: 109, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 117, columnNumber: 13 }, __self: this }, "Select a category"), /*#__PURE__*/ React.createElement("option", { value: "Components", __source: { fileName: "", lineNumber: 118, columnNumber: 13 }, __self: this }, "Components"), /*#__PURE__*/ React.createElement("option", { value: "Prompts", __source: { fileName: "", lineNumber: 119, columnNumber: 13 }, __self: this }, "Prompts"), /*#__PURE__*/ React.createElement("option", { value: "Projects", __source: { fileName: "", lineNumber: 120, columnNumber: 13 }, __self: this }, "Projects"), /*#__PURE__*/ React.createElement("option", { value: "Templates", __source: { fileName: "", lineNumber: 121, columnNumber: 13 }, __self: this }, "Templates"), /*#__PURE__*/ React.createElement("option", { value: "Integrations", __source: { fileName: "", lineNumber: 122, columnNumber: 13 }, __self: this }, "Integrations"), /*#__PURE__*/ React.createElement("option", { value: "Functions", __source: { fileName: "", lineNumber: 123, columnNumber: 13 }, __self: this }, "Functions"))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 126, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "tags", className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 127, columnNumber: 11 }, __self: this }, "Tags"), /*#__PURE__*/ React.createElement("input", { type: "text", id: "tags", name: "tags", value: formData.tags, onChange: handleInputChange, placeholder: "Enter tags separated by commas", className: "mt-1 block w-full rounded-md border-gray-300 shadow-sm focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50", __source: { fileName: "", lineNumber: 128, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 138, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "image", className: "block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 139, columnNumber: 11 }, __self: this }, "Featured Image"), /*#__PURE__*/ React.createElement("input", { type: "file", id: "image", name: "image", onChange: handleImageUpload, accept: "image/*", className: "mt-1 block w-full text-sm text-gray-500 file:mr-4 file:py-2 file:px-4 file:rounded-md file:border-0 file:text-sm file:font-semibold file:bg-blue-50 file:text-blue-700 hover:file:bg-blue-100", __source: { fileName: "", lineNumber: 140, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex justify-between", __source: { fileName: "", lineNumber: 154, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { type: "submit", className: "px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2", disabled: loading, __source: { fileName: "", lineNumber: 155, columnNumber: 11 }, __self: this }, loading ? 'Submitting...' : 'Submit Post'), /*#__PURE__*/ React.createElement("button", { type: "button", onClick: handleClear, className: "px-4 py-2 bg-gray-200 text-gray-800 rounded-md hover:bg-gray-300 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2", __source: { fileName: "", lineNumber: 162, columnNumber: 11 }, __self: this }, "Clear Form"))), message && /*#__PURE__*/ React.createElement("p", { className: "mt-4 text-center font-semibold", __source: { fileName: "", lineNumber: 171, columnNumber: 19 }, __self: this }, message), preview && /*#__PURE__*/ React.createElement("div", { className: "mt-8 p-4 border rounded-md shadow-sm", __source: { fileName: "", lineNumber: 173, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-bold mb-4", __source: { fileName: "", lineNumber: 174, columnNumber: 11 }, __self: this }, "Preview"), /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold", __source: { fileName: "", lineNumber: 175, columnNumber: 11 }, __self: this }, preview.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mt-2", __source: { fileName: "", lineNumber: 176, columnNumber: 11 }, __self: this }, preview.description), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-500 mt-2", __source: { fileName: "", lineNumber: 177, columnNumber: 11 }, __self: this }, "Category: ", preview.category), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-500", __source: { fileName: "", lineNumber: 178, columnNumber: 11 }, __self: this }, "Tags: ", preview.tags), /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-500", __source: { fileName: "", lineNumber: 179, columnNumber: 11 }, __self: this }, "Date: ", new Date().toLocaleDateString()), preview.image && /*#__PURE__*/ React.createElement("img", { src: preview.image, alt: "Preview of submitted content", className: "mt-4 max-w-full h-auto rounded-md", __source: { fileName: "", lineNumber: 181, columnNumber: 13 }, __self: this }))); }