function MainComponent() { const [jobs, setJobs] = React.useState([]); const [jobTitle, setJobTitle] = React.useState(''); const [jobDescription, setJobDescription] = React.useState(''); const [userType, setUserType] = React.useState(''); const handleJobSubmit = (event)=>{ event.preventDefault(); const newJob = { title: jobTitle, description: jobDescription, bids: [] }; setJobs([ ...jobs, newJob ]); setJobTitle(''); setJobDescription(''); }; const handleTitleChange = (event)=>{ setJobTitle(event.target.value); }; const handleDescriptionChange = (event)=>{ setJobDescription(event.target.value); }; const handleBid = (index)=>{ const updatedJobs = [ ...jobs ]; updatedJobs[index].bids.push("New bid"); setJobs(updatedJobs); }; const handleUserTypeChange = (event)=>{ setUserType(event.target.value); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-[#f7f9fc] p-4", __source: { fileName: "", lineNumber: 38, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "text-center py-4 bg-[#007bff] text-white", __source: { fileName: "", lineNumber: 39, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "font-roboto text-3xl", __source: { fileName: "", lineNumber: 40, columnNumber: 9 }, __self: this }, "Tender - Job Matchmaking"), /*#__PURE__*/ React.createElement("div", { className: "mt-2", __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setUserType('jobPoster'), className: "bg-[#fbbf24] hover:bg-[#f59e0b] text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline mr-2", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }, "Job Poster Login"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setUserType('worker'), className: "bg-[#10b981] hover:bg-[#059669] text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline", __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }, "Worker Login"))), userType === 'jobPoster' && /*#__PURE__*/ React.createElement("main", { className: "mt-8", __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("section", { className: "mb-8", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-roboto mb-4 text-[#333]", __source: { fileName: "", lineNumber: 53, columnNumber: 13 }, __self: this }, "Post a Job"), /*#__PURE__*/ React.createElement("form", { onSubmit: handleJobSubmit, className: "w-full max-w-[600px] mx-auto bg-white shadow-md rounded px-8 pt-6 pb-8 mb-4", __source: { fileName: "", lineNumber: 54, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 55, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "jobTitle", __source: { fileName: "", lineNumber: 56, columnNumber: 17 }, __self: this }, "Job Title"), /*#__PURE__*/ React.createElement("input", { value: jobTitle, onChange: handleTitleChange, className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", type: "text", id: "jobTitle", name: "jobTitle", placeholder: "e.g., Plumber needed", __source: { fileName: "", lineNumber: 59, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 61, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block text-gray-700 text-sm font-bold mb-2", htmlFor: "jobDescription", __source: { fileName: "", lineNumber: 62, columnNumber: 17 }, __self: this }, "Job Description"), /*#__PURE__*/ React.createElement("textarea", { value: jobDescription, onChange: handleDescriptionChange, className: "shadow appearance-none border rounded w-full py-2 px-3 text-gray-700 leading-tight focus:outline-none focus:shadow-outline", id: "jobDescription", name: "jobDescription", placeholder: "Describe the job details", rows: "3", __source: { fileName: "", lineNumber: 65, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 67, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { className: "bg-[#007bff] hover:bg-[#0056b3] text-white font-bold py-2 px-4 rounded focus:outline-none focus:shadow-outline", type: "submit", __source: { fileName: "", lineNumber: 68, columnNumber: 17 }, __self: this }, "Submit Job"))))), userType === 'worker' && /*#__PURE__*/ React.createElement("section", { __source: { fileName: "", lineNumber: 77, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-roboto mb-4 text-[#333]", __source: { fileName: "", lineNumber: 78, columnNumber: 11 }, __self: this }, "Available Jobs"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 79, columnNumber: 11 }, __self: this }, jobs.map((job, index)=>/*#__PURE__*/ React.createElement("div", { className: "bg-white overflow-hidden shadow-md rounded-lg", key: index, __source: { fileName: "", lineNumber: 81, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "px-6 py-4", __source: { fileName: "", lineNumber: 82, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-bold text-xl mb-2", __source: { fileName: "", lineNumber: 83, columnNumber: 19 }, __self: this }, job.title), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 text-base", __source: { fileName: "", lineNumber: 84, columnNumber: 19 }, __self: this }, job.description)), /*#__PURE__*/ React.createElement("div", { className: "px-6 pt-4 pb-2", __source: { fileName: "", lineNumber: 88, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "inline-block bg-[#007bff] rounded-full px-3 py-1 text-sm font-semibold text-white mr-2 mb-2", __source: { fileName: "", lineNumber: 89, columnNumber: 19 }, __self: this }, "Bids: ", job.bids.length), /*#__PURE__*/ React.createElement("button", { onClick: ()=>handleBid(index), className: "inline-block bg-[#28a745] rounded-full px-3 py-1 text-sm font-semibold text-white", __source: { fileName: "", lineNumber: 90, columnNumber: 19 }, __self: this }, "Bid on Job")))))), /*#__PURE__*/ React.createElement("footer", { className: "text-center py-4 mt-8 bg-[#007bff] text-white", __source: { fileName: "", lineNumber: 99, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "font-roboto", __source: { fileName: "", lineNumber: 100, columnNumber: 9 }, __self: this }, "© 2023 Tender - Job Matchmaking"))); }