function MainComponent() { const [borrowRequests, setBorrowRequests] = React.useState([]); const [lenderResponses, setLenderResponses] = React.useState([]); const [reviews, setReviews] = React.useState([]); const handleBorrowRequest = (e)=>{ e.preventDefault(); const { borrowerName, itemName, borrowDuration } = e.target.elements; setBorrowRequests([ ...borrowRequests, { borrowerName: borrowerName.value, itemName: itemName.value, borrowDuration: borrowDuration.value } ]); e.target.reset(); }; const handleLenderResponse = (e)=>{ e.preventDefault(); const { lenderName, termsAmount } = e.target.elements; setLenderResponses([ ...lenderResponses, { lenderName: lenderName.value, termsAmount: termsAmount.value } ]); e.target.reset(); }; const handleReview = (e)=>{ e.preventDefault(); const { reviewFor, reviewText, rating } = e.target.elements; setReviews([ ...reviews, { reviewFor: reviewFor.value, reviewText: reviewText.value, rating: rating.value } ]); e.target.reset(); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-100 p-4 font-sans", __source: { fileName: "", lineNumber: 48, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto", __source: { fileName: "", lineNumber: 49, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-4xl font-bold text-center mb-8", __source: { fileName: "", lineNumber: 50, columnNumber: 9 }, __self: this }, "Borrower-Lender Community"), /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 52, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-4", __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this }, "Borrow Requests"), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4 rounded shadow-md", __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleBorrowRequest, __source: { fileName: "", lineNumber: 55, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", htmlFor: "borrower-name", __source: { fileName: "", lineNumber: 56, columnNumber: 15 }, __self: this }, "Borrower Name:"), /*#__PURE__*/ React.createElement("input", { className: "border w-full p-2 mb-4", type: "text", name: "borrower-name", __source: { fileName: "", lineNumber: 57, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", htmlFor: "item-name", __source: { fileName: "", lineNumber: 59, columnNumber: 15 }, __self: this }, "Item Name:"), /*#__PURE__*/ React.createElement("input", { className: "border w-full p-2 mb-4", type: "text", name: "item-name", __source: { fileName: "", lineNumber: 60, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", htmlFor: "borrow-duration", __source: { fileName: "", lineNumber: 62, columnNumber: 15 }, __self: this }, "Duration (days):"), /*#__PURE__*/ React.createElement("input", { className: "border w-full p-2 mb-4", type: "number", name: "borrow-duration", __source: { fileName: "", lineNumber: 63, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "bg-blue-500 text-white p-2 rounded hover:bg-blue-700", __source: { fileName: "", lineNumber: 65, columnNumber: 15 }, __self: this }, "Request to Borrow")))), /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 70, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-4", __source: { fileName: "", lineNumber: 71, columnNumber: 11 }, __self: this }, "Lender Responses"), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4 rounded shadow-md", __source: { fileName: "", lineNumber: 72, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleLenderResponse, __source: { fileName: "", lineNumber: 73, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", htmlFor: "lender-name", __source: { fileName: "", lineNumber: 74, columnNumber: 15 }, __self: this }, "Lender Name:"), /*#__PURE__*/ React.createElement("input", { className: "border w-full p-2 mb-4", type: "text", name: "lender-name", __source: { fileName: "", lineNumber: 75, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", htmlFor: "terms-amount", __source: { fileName: "", lineNumber: 77, columnNumber: 15 }, __self: this }, "Terms and Amounts:"), /*#__PURE__*/ React.createElement("input", { className: "border w-full p-2 mb-4", type: "text", name: "terms-amount", __source: { fileName: "", lineNumber: 78, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("button", { className: "bg-green-500 text-white p-2 rounded hover:bg-green-700", __source: { fileName: "", lineNumber: 80, columnNumber: 15 }, __self: this }, "Set Terms")))), /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 85, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-semibold mb-4", __source: { fileName: "", lineNumber: 86, columnNumber: 11 }, __self: this }, "Reviews"), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4 rounded shadow-md space-y-4", __source: { fileName: "", lineNumber: 87, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("form", { onSubmit: handleReview, __source: { fileName: "", lineNumber: 88, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", htmlFor: "review-for", __source: { fileName: "", lineNumber: 89, columnNumber: 15 }, __self: this }, "Review For:"), /*#__PURE__*/ React.createElement("select", { className: "border w-full p-2 mb-4", name: "review-for", __source: { fileName: "", lineNumber: 90, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "borrower", __source: { fileName: "", lineNumber: 91, columnNumber: 17 }, __self: this }, "Borrower"), /*#__PURE__*/ React.createElement("option", { value: "lender", __source: { fileName: "", lineNumber: 92, columnNumber: 17 }, __self: this }, "Lender")), /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", htmlFor: "review-text", __source: { fileName: "", lineNumber: 95, columnNumber: 15 }, __self: this }, "Review:"), /*#__PURE__*/ React.createElement("textarea", { className: "border w-full p-2 mb-4", name: "review-text", __source: { fileName: "", lineNumber: 96, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("label", { className: "block text-sm font-medium mb-2", htmlFor: "rating", __source: { fileName: "", lineNumber: 98, columnNumber: 15 }, __self: this }, "Rating:"), /*#__PURE__*/ React.createElement("select", { className: "border w-full p-2 mb-4", name: "rating", __source: { fileName: "", lineNumber: 99, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "5", __source: { fileName: "", lineNumber: 100, columnNumber: 17 }, __self: this }, "⭐️⭐️⭐️⭐️⭐️"), /*#__PURE__*/ React.createElement("option", { value: "4", __source: { fileName: "", lineNumber: 101, columnNumber: 17 }, __self: this }, "⭐️⭐️⭐️⭐️"), /*#__PURE__*/ React.createElement("option", { value: "3", __source: { fileName: "", lineNumber: 102, columnNumber: 17 }, __self: this }, "⭐️⭐️⭐️"), /*#__PURE__*/ React.createElement("option", { value: "2", __source: { fileName: "", lineNumber: 103, columnNumber: 17 }, __self: this }, "⭐️⭐️"), /*#__PURE__*/ React.createElement("option", { value: "1", __source: { fileName: "", lineNumber: 104, columnNumber: 17 }, __self: this }, "⭐️")), /*#__PURE__*/ React.createElement("button", { className: "bg-purple-500 text-white p-2 rounded hover:bg-purple-700", __source: { fileName: "", lineNumber: 107, columnNumber: 15 }, __self: this }, "Submit Review"))), /*#__PURE__*/ React.createElement("div", { className: "mt-8", __source: { fileName: "", lineNumber: 111, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold mb-4", __source: { fileName: "", lineNumber: 112, columnNumber: 13 }, __self: this }, "Community Reviews"), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-4 rounded shadow-md space-y-4", __source: { fileName: "", lineNumber: 113, columnNumber: 13 }, __self: this }, reviews.map((review, index)=>/*#__PURE__*/ React.createElement("div", { key: index, __source: { fileName: "", lineNumber: 115, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-medium", __source: { fileName: "", lineNumber: 116, columnNumber: 19 }, __self: this }, review.reviewFor === 'borrower' ? 'Borrower Review' : 'Lender Review'), /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 117, columnNumber: 19 }, __self: this }, Array.from({ length: review.rating }, (_, i)=>'⭐️').join(''), " - ", review.reviewText)))))))); }