function ReviewAdditionButton({ setShowForm }) { return /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowForm(true), className: "mb-4 py-2 px-4 bg-[#121212] text-white rounded-lg", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, "Add Review"); } function ReviewAdditionButtonStory() { const [showForm, setShowForm] = React.useState(false); return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 15, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(ReviewAdditionButton, { setShowForm: setShowForm, __source: { fileName: "", lineNumber: 16, columnNumber: 7 }, __self: this }), showForm && /*#__PURE__*/ React.createElement("form", { className: "space-y-4", __source: { fileName: "", lineNumber: 17, columnNumber: 20 }, __self: this })); } function MainComponent() { const [showForm, setShowForm] = React.useState(false); const [reviews, setReviews] = React.useState([ { name: 'John Doe', review: 'Great place to work and relax. Love the environment!', location: 'Googleplex' }, { name: 'Jane Smith', review: 'A must-visit for tech enthusiasts. The architecture is amazing!', location: 'Innovate Hub' }, { name: 'Alex Johnson', review: 'Incredible place for innovation and creativity.', location: 'Tech Park' } ]); const [newReview, setNewReview] = React.useState({ name: '', review: '', location: '' }); const handleInputChange = (e)=>{ const { name, value } = e.target; setNewReview({ ...newReview, [name]: value }); }; const handleSubmit = (e)=>{ e.preventDefault(); if (!newReview.name || !newReview.review || !newReview.location) return; setReviews([ ...reviews, newReview ]); setNewReview({ name: '', review: '', location: '' }); setShowForm(false); }; return /*#__PURE__*/ React.createElement("div", { className: "flex flex-col md:flex-row", __source: { fileName: "", lineNumber: 24, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 h-[500px] md:h-screen overflow-hidden", __source: { fileName: "", lineNumber: 25, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("iframe", { title: "Interactive Map", src: "https://www.google.com/maps/d/u/0/embed?mid=1s3PYlPW4E7vgeOFZFC3_l2vowPWkX-Q&ehbc=2E312F", width: "100%", height: "100%", frameBorder: "0", style: { border: 0 }, allowFullScreen: "", loading: "lazy", referrerPolicy: "no-referrer-when-downgrade", __source: { fileName: "", lineNumber: 26, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "w-full md:w-1/2 h-screen bg-[#f7f7f7] overflow-y-auto px-4 py-8", __source: { fileName: "", lineNumber: 37, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-roboto text-[#121212] text-3xl mb-6", __source: { fileName: "", lineNumber: 38, columnNumber: 9 }, __self: this }, "Place Your Pin!"), /*#__PURE__*/ React.createElement(ReviewAdditionButton, { setShowForm: setShowForm, __source: { fileName: "", lineNumber: 39, columnNumber: 9 }, __self: this }), showForm && /*#__PURE__*/ React.createElement("form", { onSubmit: handleSubmit, className: "mb-4 space-y-4", __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col", __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "name", className: "font-roboto text-[#121212] mb-2", __source: { fileName: "", lineNumber: 43, columnNumber: 15 }, __self: this }, "Name"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "name", className: "p-2 border rounded-lg", value: newReview.name, onChange: handleInputChange, __source: { fileName: "", lineNumber: 44, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col", __source: { fileName: "", lineNumber: 52, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "review", className: "font-roboto text-[#121212] mb-2", __source: { fileName: "", lineNumber: 53, columnNumber: 15 }, __self: this }, "Review"), /*#__PURE__*/ React.createElement("textarea", { name: "review", className: "p-2 border rounded-lg", rows: "4", value: newReview.review, onChange: handleInputChange, __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col", __source: { fileName: "", lineNumber: 62, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { htmlFor: "location", className: "font-roboto text-[#121212] mb-2", __source: { fileName: "", lineNumber: 63, columnNumber: 15 }, __self: this }, "Location"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "location", className: "p-2 border rounded-lg", value: newReview.location, onChange: handleInputChange, __source: { fileName: "", lineNumber: 64, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("button", { type: "submit", className: "py-2 px-4 bg-[#121212] text-white rounded-lg", __source: { fileName: "", lineNumber: 72, columnNumber: 13 }, __self: this }, "Submit Pin")), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 75, columnNumber: 9 }, __self: this }, reviews.map((review, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-white p-4 shadow-lg rounded-lg", __source: { fileName: "", lineNumber: 77, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-roboto text-[#121212] text-xl mb-2", __source: { fileName: "", lineNumber: 78, columnNumber: 15 }, __self: this }, review.name), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-[#646464] mb-2", __source: { fileName: "", lineNumber: 79, columnNumber: 15 }, __self: this }, review.review), /*#__PURE__*/ React.createElement("p", { className: "font-roboto text-[#646464] italic", __source: { fileName: "", lineNumber: 80, columnNumber: 15 }, __self: this }, "Location: ", review.location)))))); }