function MainComponent() { const [stories, setStories] = React.useState([]); const handleSubmit = (event)=>{ event.preventDefault(); const formData = new FormData(event.target); const newStory = { title: formData.get('title'), content: formData.get('content'), imageURL: formData.get('imageURL'), datetime: new Date().toLocaleString() }; setStories([ newStory, ...stories ]); }; const StoryCard = ({ title, content, imageURL, datetime })=>/*#__PURE__*/ React.createElement("div", { className: "max-w-md rounded overflow-hidden shadow-lg bg-white my-4 mx-auto", __source: { fileName: "", lineNumber: 17, columnNumber: 5 }, __self: this }, imageURL && /*#__PURE__*/ React.createElement("img", { className: "w-full h-[200px] object-cover", src: imageURL, alt: `Image for the story titled ${title}`, __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "px-6 py-4", __source: { fileName: "", lineNumber: 25, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-bold text-xl mb-2 text-[#333]", __source: { fileName: "", lineNumber: 26, columnNumber: 9 }, __self: this }, title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 text-base", __source: { fileName: "", lineNumber: 27, columnNumber: 9 }, __self: this }, datetime), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 text-base mt-2", __source: { fileName: "", lineNumber: 28, columnNumber: 9 }, __self: this }, content))); const StoriesList = ({ stories })=>/*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 34, columnNumber: 5 }, __self: this }, stories.map((story, index)=>/*#__PURE__*/ React.createElement(StoryCard, { key: `story-${index}`, ...story, __source: { fileName: "", lineNumber: 36, columnNumber: 9 }, __self: this }))); return /*#__PURE__*/ React.createElement("div", { className: "font-roboto", __source: { fileName: "", lineNumber: 42, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "bg-[#ffcc00] p-6", __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-black text-3xl", __source: { fileName: "", lineNumber: 44, columnNumber: 9 }, __self: this }, "Weazel News")), /*#__PURE__*/ React.createElement("main", { className: "container mx-auto p-8", __source: { fileName: "", lineNumber: 46, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("section", { className: "mb-6", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "flex flex-col gap-4", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "text", name: "title", placeholder: "Story Title", className: "p-2 border border-gray-300 rounded", required: true, __source: { fileName: "", lineNumber: 49, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("textarea", { name: "content", placeholder: "Story Content", className: "p-2 border border-gray-300 rounded", rows: "5", required: true, __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "text", name: "imageURL", placeholder: "Image URL", className: "p-2 border border-gray-300 rounded", __source: { fileName: "", lineNumber: 63, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "bg-[#ffcc00] hover:bg-[#e6b800] text-black font-bold py-2 px-4 rounded", __source: { fileName: "", lineNumber: 69, columnNumber: 13 }, __self: this }, "Post Story"))), /*#__PURE__*/ React.createElement("section", { __source: { fileName: "", lineNumber: 77, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl mb-4", __source: { fileName: "", lineNumber: 78, columnNumber: 11 }, __self: this }, "Latest Los Santos News"), /*#__PURE__*/ React.createElement(StoriesList, { stories: stories, __source: { fileName: "", lineNumber: 79, columnNumber: 11 }, __self: this })))); }