function MainComponent() { const [posts, setPosts] = React.useState([]); const [currentUser, setCurrentUser] = React.useState(null); // Replace with your auth logic const handleSubmit = (event)=>{ event.preventDefault(); const formData = new FormData(event.target); const newPost = { id: Date.now(), username: formData.get('username'), content: formData.get('content'), favorite: false }; setPosts([ newPost, ...posts ]); event.target.reset(); }; const toggleFavorite = (id)=>{ setPosts(posts.map((post)=>post.id === id ? { ...post, favorite: !post.favorite } : post)); }; const deletePost = (id)=>{ setPosts(posts.filter((post)=>post.id !== id)); }; return /*#__PURE__*/ React.createElement("div", { className: "p-6 bg-gray-100 min-h-screen flex flex-col items-center", __source: { fileName: "", lineNumber: 29, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-sans mb-6", __source: { fileName: "", lineNumber: 30, columnNumber: 7 }, __self: this }, "一言掲示板"), /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-[600px] bg-white p-6 shadow-md rounded", __source: { fileName: "", lineNumber: 31, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("form", { className: "mb-4", onSubmit: handleSubmit, __source: { fileName: "", lineNumber: 32, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 33, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 font-bold mb-2", htmlFor: "username", __source: { fileName: "", lineNumber: 34, columnNumber: 13 }, __self: this }, "投稿者名"), /*#__PURE__*/ React.createElement("input", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "username", type: "text", name: "username", placeholder: "投稿者名", __source: { fileName: "", lineNumber: 37, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 font-bold mb-2", htmlFor: "content", __source: { fileName: "", lineNumber: 46, columnNumber: 13 }, __self: this }, "投稿内容"), /*#__PURE__*/ React.createElement("textarea", { className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "content", name: "content", maxLength: "200", placeholder: "200文字まで", rows: "4", __source: { fileName: "", lineNumber: 49, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("button", { className: "bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline", type: "submit", __source: { fileName: "", lineNumber: 58, columnNumber: 11 }, __self: this }, "投稿")), /*#__PURE__*/ React.createElement("div", { id: "posts", __source: { fileName: "", lineNumber: 65, columnNumber: 9 }, __self: this }, posts.map((post)=>/*#__PURE__*/ React.createElement("div", { key: post.id, className: "post bg-gray-200 p-4 rounded my-2", __source: { fileName: "", lineNumber: 67, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between items-center mb-2", __source: { fileName: "", lineNumber: 68, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-800 font-bold", __source: { fileName: "", lineNumber: 69, columnNumber: 17 }, __self: this }, post.username), /*#__PURE__*/ React.createElement("button", { className: `text-red-500 ${post.favorite ? 'text-red-700' : ''}`, onClick: ()=>toggleFavorite(post.id), __source: { fileName: "", lineNumber: 70, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-heart", __source: { fileName: "", lineNumber: 74, columnNumber: 19 }, __self: this }))), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700", __source: { fileName: "", lineNumber: 77, columnNumber: 15 }, __self: this }, post.content), currentUser === post.username && /*#__PURE__*/ React.createElement("button", { className: "text-red-500 mt-2", onClick: ()=>deletePost(post.id), __source: { fileName: "", lineNumber: 79, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-trash", __source: { fileName: "", lineNumber: 80, columnNumber: 19 }, __self: this }), " 消去")))))); }