function SearchFilters({ onFilterChange, initialFilters = {} }) { const [filters, setFilters] = useState({ state: '', jobType: '', salaryMin: '', salaryMax: '', experienceYears: '', degreeRequired: null, polygraphRequired: null, tattoosAllowed: null, ...initialFilters }); const states = [ "AL", "AK", "AZ", "AR", "CA", "CO", "CT", "DE", "FL", "GA", "HI", "ID", "IL", "IN", "IA", "KS", "KY", "LA", "ME", "MD", "MA", "MI", "MN", "MS", "MO", "MT", "NE", "NV", "NH", "NJ", "NM", "NY", "NC", "ND", "OH", "OK", "OR", "PA", "RI", "SC", "SD", "TN", "TX", "UT", "VT", "VA", "WA", "WV", "WI", "WY" ]; const jobTypes = [ { value: 'federal', label: 'Federal' }, { value: 'municipality', label: 'Municipality' }, { value: 'county', label: 'County' }, { value: 'educational', label: 'Educational' }, { value: 'transit', label: 'Transit' }, { value: 'regional', label: 'Regional' }, { value: 'other', label: 'Other' } ]; const handleChange = (field, value)=>{ const newFilters = { ...filters, [field]: value }; setFilters(newFilters); onFilterChange(newFilters); }; return /*#__PURE__*/ React.createElement("div", { className: "w-64 rounded-lg border border-gray-200 bg-white p-6 shadow-sm", __source: { fileName: "", lineNumber: 39, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "mb-4 text-lg font-semibold text-gray-900", __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this }, "Filter Jobs"), /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 42, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 43, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "mb-1 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, "State"), /*#__PURE__*/ React.createElement("select", { value: filters.state, onChange: (e)=>handleChange('state', e.target.value), className: "w-full rounded-lg border border-gray-300 bg-white px-3 py-2 text-gray-700 focus:border-[#357AFF] focus:outline-none focus:ring-1 focus:ring-[#357AFF]", __source: { fileName: "", lineNumber: 45, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 50, columnNumber: 13 }, __self: this }, "All States"), states.map((state)=>/*#__PURE__*/ React.createElement("option", { key: state, value: state, __source: { fileName: "", lineNumber: 52, columnNumber: 15 }, __self: this }, state)))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 57, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "mb-1 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 58, columnNumber: 11 }, __self: this }, "Job Type"), /*#__PURE__*/ React.createElement("select", { value: filters.jobType, onChange: (e)=>handleChange('jobType', e.target.value), className: "w-full rounded-lg border border-gray-300 bg-white px-3 py-2 text-gray-700 focus:border-[#357AFF] focus:outline-none focus:ring-1 focus:ring-[#357AFF]", __source: { fileName: "", lineNumber: 59, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 64, columnNumber: 13 }, __self: this }, "All Types"), jobTypes.map((type)=>/*#__PURE__*/ React.createElement("option", { key: type.value, value: type.value, __source: { fileName: "", lineNumber: 66, columnNumber: 15 }, __self: this }, type.label)))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "mb-1 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 72, columnNumber: 11 }, __self: this }, "Salary Range"), /*#__PURE__*/ React.createElement("div", { className: "flex gap-2", __source: { fileName: "", lineNumber: 73, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "number", placeholder: "Min", value: filters.salaryMin, onChange: (e)=>handleChange('salaryMin', e.target.value), className: "w-1/2 rounded-lg border border-gray-300 px-3 py-2 focus:border-[#357AFF] focus:outline-none focus:ring-1 focus:ring-[#357AFF]", __source: { fileName: "", lineNumber: 74, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "number", placeholder: "Max", value: filters.salaryMax, onChange: (e)=>handleChange('salaryMax', e.target.value), className: "w-1/2 rounded-lg border border-gray-300 px-3 py-2 focus:border-[#357AFF] focus:outline-none focus:ring-1 focus:ring-[#357AFF]", __source: { fileName: "", lineNumber: 81, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 91, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "mb-1 block text-sm font-medium text-gray-700", __source: { fileName: "", lineNumber: 92, columnNumber: 11 }, __self: this }, "Experience Required"), /*#__PURE__*/ React.createElement("select", { value: filters.experienceYears, onChange: (e)=>handleChange('experienceYears', e.target.value), className: "w-full rounded-lg border border-gray-300 bg-white px-3 py-2 text-gray-700 focus:border-[#357AFF] focus:outline-none focus:ring-1 focus:ring-[#357AFF]", __source: { fileName: "", lineNumber: 93, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "", __source: { fileName: "", lineNumber: 98, columnNumber: 13 }, __self: this }, "Any"), /*#__PURE__*/ React.createElement("option", { value: "0", __source: { fileName: "", lineNumber: 99, columnNumber: 13 }, __self: this }, "Entry Level"), /*#__PURE__*/ React.createElement("option", { value: "1", __source: { fileName: "", lineNumber: 100, columnNumber: 13 }, __self: this }, "1+ Years"), /*#__PURE__*/ React.createElement("option", { value: "3", __source: { fileName: "", lineNumber: 101, columnNumber: 13 }, __self: this }, "3+ Years"), /*#__PURE__*/ React.createElement("option", { value: "5", __source: { fileName: "", lineNumber: 102, columnNumber: 13 }, __self: this }, "5+ Years"), /*#__PURE__*/ React.createElement("option", { value: "10", __source: { fileName: "", lineNumber: 103, columnNumber: 13 }, __self: this }, "10+ Years"))), /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 107, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "flex items-center", __source: { fileName: "", lineNumber: 108, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", checked: filters.degreeRequired === true, onChange: (e)=>handleChange('degreeRequired', e.target.checked ? true : null), className: "h-4 w-4 rounded border-gray-300 text-[#357AFF] focus:ring-[#357AFF]", __source: { fileName: "", lineNumber: 109, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-sm text-gray-600", __source: { fileName: "", lineNumber: 115, columnNumber: 13 }, __self: this }, "Degree Required")), /*#__PURE__*/ React.createElement("label", { className: "flex items-center", __source: { fileName: "", lineNumber: 118, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", checked: filters.polygraphRequired === true, onChange: (e)=>handleChange('polygraphRequired', e.target.checked ? true : null), className: "h-4 w-4 rounded border-gray-300 text-[#357AFF] focus:ring-[#357AFF]", __source: { fileName: "", lineNumber: 119, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-sm text-gray-600", __source: { fileName: "", lineNumber: 125, columnNumber: 13 }, __self: this }, "Polygraph Required")), /*#__PURE__*/ React.createElement("label", { className: "flex items-center", __source: { fileName: "", lineNumber: 128, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("input", { type: "checkbox", checked: filters.tattoosAllowed === true, onChange: (e)=>handleChange('tattoosAllowed', e.target.checked ? true : null), className: "h-4 w-4 rounded border-gray-300 text-[#357AFF] focus:ring-[#357AFF]", __source: { fileName: "", lineNumber: 129, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "ml-2 text-sm text-gray-600", __source: { fileName: "", lineNumber: 135, columnNumber: 13 }, __self: this }, "Tattoos Allowed"))), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ const emptyFilters = { state: '', jobType: '', salaryMin: '', salaryMax: '', experienceYears: '', degreeRequired: null, polygraphRequired: null, tattoosAllowed: null }; setFilters(emptyFilters); onFilterChange(emptyFilters); }, className: "mt-4 w-full rounded-lg bg-gray-100 py-2 text-sm font-medium text-gray-700 transition-colors hover:bg-gray-200 focus:outline-none focus:ring-2 focus:ring-gray-200 focus:ring-offset-2", __source: { fileName: "", lineNumber: 139, columnNumber: 9 }, __self: this }, "Reset Filters"))); } function SearchFiltersStory() { const [filters, setFilters] = useState({}); const handleFilterChange = (newFilters)=>{ setFilters(newFilters); console.log('Filters updated:', newFilters); }; return /*#__PURE__*/ React.createElement("div", { className: "bg-gray-100 p-4", __source: { fileName: "", lineNumber: 172, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(SearchFilters, { onFilterChange: handleFilterChange, initialFilters: { state: 'CA', jobType: 'federal', salaryMin: '50000', salaryMax: '100000', experienceYears: '3', degreeRequired: true, polygraphRequired: false, tattoosAllowed: true }, __source: { fileName: "", lineNumber: 173, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "mt-4", __source: { fileName: "", lineNumber: 186, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("pre", { className: "rounded-lg bg-white p-4 text-sm", __source: { fileName: "", lineNumber: 187, columnNumber: 9 }, __self: this }, JSON.stringify(filters, null, 2)))); } function JobDetailModal({ isOpen, onClose, job = {}, isLoggedIn, onApply, onSave }) { if (!isOpen) return null; const { title, agency, city, state, salaryMin, salaryMax, degreeRequired, description, requirements, contactName, contactEmail, applicationInstructions, agencyDescription, department, postingDate } = job; const formattedSalary = salaryMin && salaryMax ? `$${(salaryMin / 1000).toFixed(0)}k - $${(salaryMax / 1000).toFixed(0)}k` : "Salary not specified"; const formattedDate = postingDate ? new Date(postingDate).toLocaleDateString('en-US', { year: 'numeric', month: 'long', day: 'numeric' }) : null; return /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 z-50 flex items-center justify-center p-4 bg-black bg-opacity-50", __source: { fileName: "", lineNumber: 42, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative w-full max-h-[90vh] max-w-4xl overflow-y-auto rounded-xl bg-white shadow-xl", __source: { fileName: "", lineNumber: 43, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: onClose, className: "absolute right-4 top-4 text-gray-400 hover:text-gray-600", __source: { fileName: "", lineNumber: 44, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times text-xl", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "p-6 md:p-8", __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-6", __source: { fileName: "", lineNumber: 52, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap items-start justify-between gap-4", __source: { fileName: "", lineNumber: 53, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl md:text-3xl font-bold text-gray-900", __source: { fileName: "", lineNumber: 55, columnNumber: 17 }, __self: this }, title), /*#__PURE__*/ React.createElement("p", { className: "mt-2 text-lg text-gray-600", __source: { fileName: "", lineNumber: 56, columnNumber: 17 }, __self: this }, agency), /*#__PURE__*/ React.createElement("p", { className: "mt-1 text-gray-500", __source: { fileName: "", lineNumber: 57, columnNumber: 17 }, __self: this }, city, ", ", state)), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col gap-2", __source: { fileName: "", lineNumber: 61, columnNumber: 15 }, __self: this }, formattedDate && /*#__PURE__*/ React.createElement("p", { className: "text-sm text-gray-500", __source: { fileName: "", lineNumber: 63, columnNumber: 19 }, __self: this }, "Posted: ", formattedDate), /*#__PURE__*/ React.createElement("p", { className: "text-lg font-medium text-gray-900", __source: { fileName: "", lineNumber: 65, columnNumber: 17 }, __self: this }, formattedSalary), degreeRequired && /*#__PURE__*/ React.createElement("span", { className: "inline-flex items-center rounded-full bg-blue-100 px-3 py-1 text-sm text-blue-800", __source: { fileName: "", lineNumber: 67, columnNumber: 19 }, __self: this }, "Degree Required")))), /*#__PURE__*/ React.createElement("div", { className: "space-y-6", __source: { fileName: "", lineNumber: 75, columnNumber: 11 }, __self: this }, description && /*#__PURE__*/ React.createElement("section", { __source: { fileName: "", lineNumber: 77, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold text-gray-900 mb-3", __source: { fileName: "", lineNumber: 78, columnNumber: 17 }, __self: this }, "Job Description"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 whitespace-pre-line", __source: { fileName: "", lineNumber: 79, columnNumber: 17 }, __self: this }, description)), requirements && /*#__PURE__*/ React.createElement("section", { __source: { fileName: "", lineNumber: 84, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold text-gray-900 mb-3", __source: { fileName: "", lineNumber: 85, columnNumber: 17 }, __self: this }, "Requirements"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 whitespace-pre-line", __source: { fileName: "", lineNumber: 86, columnNumber: 17 }, __self: this }, requirements)), isLoggedIn && applicationInstructions && /*#__PURE__*/ React.createElement("section", { __source: { fileName: "", lineNumber: 91, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold text-gray-900 mb-3", __source: { fileName: "", lineNumber: 92, columnNumber: 17 }, __self: this }, "How to Apply"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 whitespace-pre-line", __source: { fileName: "", lineNumber: 93, columnNumber: 17 }, __self: this }, applicationInstructions)), isLoggedIn && (contactName || contactEmail) && /*#__PURE__*/ React.createElement("section", { __source: { fileName: "", lineNumber: 98, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold text-gray-900 mb-3", __source: { fileName: "", lineNumber: 99, columnNumber: 17 }, __self: this }, "Contact Information"), /*#__PURE__*/ React.createElement("div", { className: "text-gray-700", __source: { fileName: "", lineNumber: 100, columnNumber: 17 }, __self: this }, contactName && /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 101, columnNumber: 35 }, __self: this }, "Contact: ", contactName), contactEmail && /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 102, columnNumber: 36 }, __self: this }, "Email: ", contactEmail))), (agencyDescription || department) && /*#__PURE__*/ React.createElement("section", { __source: { fileName: "", lineNumber: 108, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold text-gray-900 mb-3", __source: { fileName: "", lineNumber: 109, columnNumber: 17 }, __self: this }, "About the Agency"), department && /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 mb-2", __source: { fileName: "", lineNumber: 111, columnNumber: 19 }, __self: this }, "Department: ", department), agencyDescription && /*#__PURE__*/ React.createElement("p", { className: "text-gray-700 whitespace-pre-line", __source: { fileName: "", lineNumber: 114, columnNumber: 19 }, __self: this }, agencyDescription))), /*#__PURE__*/ React.createElement("div", { className: "mt-8 flex flex-col sm:flex-row gap-3", __source: { fileName: "", lineNumber: 120, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: onApply, className: "rounded-lg bg-[#357AFF] px-6 py-3 text-base font-medium text-white transition-colors hover:bg-[#2E69DE] focus:outline-none focus:ring-2 focus:ring-[#357AFF] focus:ring-offset-2", __source: { fileName: "", lineNumber: 121, columnNumber: 13 }, __self: this }, "Apply Now"), isLoggedIn && /*#__PURE__*/ React.createElement("button", { onClick: onSave, className: "rounded-lg border border-gray-300 bg-white px-6 py-3 text-base font-medium text-gray-700 transition-colors hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-[#357AFF] focus:ring-offset-2", __source: { fileName: "", lineNumber: 128, columnNumber: 15 }, __self: this }, "Save Job"))))); } function JobDetailModalStory() { const [isOpen, setIsOpen] = useState(false); const [savedStatus, setSavedStatus] = useState(false); const mockJob = { title: "Senior Software Engineer", agency: "Tech Solutions Agency", city: "San Francisco", state: "CA", salaryMin: 120000, salaryMax: 180000, degreeRequired: true, description: "We are seeking an experienced software engineer to join our team...\n\nThe ideal candidate will have strong problem-solving skills and experience with modern web technologies.", requirements: "- 5+ years of software development experience\n- Strong proficiency in JavaScript and React\n- Experience with cloud platforms\n- Bachelor's degree in Computer Science or related field", contactName: "John Smith", contactEmail: "john.smith@techagency.gov", applicationInstructions: "Please submit your resume and cover letter through our online portal. Applications must include three professional references.", agencyDescription: "Tech Solutions Agency is dedicated to modernizing government technology infrastructure and providing innovative solutions for citizens.", department: "Information Technology", postingDate: "2025-01-15" }; return /*#__PURE__*/ React.createElement("div", { className: "space-y-4 p-4", __source: { fileName: "", lineNumber: 165, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex gap-4", __source: { fileName: "", lineNumber: 166, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsOpen(true), className: "rounded-lg bg-[#357AFF] px-4 py-2 text-white", __source: { fileName: "", lineNumber: 167, columnNumber: 9 }, __self: this }, "Open Modal (Logged In)"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setIsOpen(true); setSavedStatus(true); }, className: "rounded-lg bg-gray-200 px-4 py-2 text-gray-700", __source: { fileName: "", lineNumber: 173, columnNumber: 9 }, __self: this }, "Open Modal (Logged Out)")), /*#__PURE__*/ React.createElement(JobDetailModal, { isOpen: isOpen, onClose: ()=>setIsOpen(false), job: mockJob, isLoggedIn: true, onApply: ()=>alert('Apply clicked'), onSave: ()=>alert('Save clicked'), __source: { fileName: "", lineNumber: 184, columnNumber: 7 }, __self: this })); } function JobCard({ job, showDegreeFlag = false, onViewDetails, onSaveJob, isLoggedIn }) { const { title, agency_id, city, state, salary_min, salary_max, degree_required, job_type, experience_years, polygraph_required, tattoos_allowed } = job; const formattedSalary = salary_min && salary_max ? `$${(salary_min / 1000).toFixed(0)}k - $${(salary_max / 1000).toFixed(0)}k` : null; return /*#__PURE__*/ React.createElement("div", { className: "w-full max-w-2xl rounded-lg border border-gray-200 bg-white p-6 shadow-sm transition-all hover:shadow-md", __source: { fileName: "", lineNumber: 21, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-between", __source: { fileName: "", lineNumber: 22, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 23, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-xl font-semibold text-gray-900", __source: { fileName: "", lineNumber: 24, columnNumber: 11 }, __self: this }, title), /*#__PURE__*/ React.createElement("p", { className: "mt-1 text-gray-600", __source: { fileName: "", lineNumber: 25, columnNumber: 11 }, __self: this }, agency_id), /*#__PURE__*/ React.createElement("p", { className: "mt-1 text-gray-500", __source: { fileName: "", lineNumber: 26, columnNumber: 11 }, __self: this }, city, ", ", state), formattedSalary && /*#__PURE__*/ React.createElement("p", { className: "mt-2 text-gray-700", __source: { fileName: "", lineNumber: 30, columnNumber: 13 }, __self: this }, formattedSalary)), showDegreeFlag && degree_required && /*#__PURE__*/ React.createElement("span", { className: "flex h-fit items-center rounded-full bg-blue-100 px-3 py-1 text-sm text-blue-800", __source: { fileName: "", lineNumber: 34, columnNumber: 11 }, __self: this }, "Degree Required")), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-2 mt-3", __source: { fileName: "", lineNumber: 40, columnNumber: 7 }, __self: this }, experience_years > 0 && /*#__PURE__*/ React.createElement("span", { className: "bg-gray-100 px-2 py-1 rounded-full text-sm", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }, experience_years, "+ Years Experience"), degree_required && !showDegreeFlag && /*#__PURE__*/ React.createElement("span", { className: "bg-blue-100 text-blue-800 px-2 py-1 rounded-full text-sm", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, "Degree Required"), polygraph_required && /*#__PURE__*/ React.createElement("span", { className: "bg-red-100 text-red-800 px-2 py-1 rounded-full text-sm", __source: { fileName: "", lineNumber: 54, columnNumber: 11 }, __self: this }, "Polygraph Required"), tattoos_allowed && /*#__PURE__*/ React.createElement("span", { className: "bg-green-100 text-green-800 px-2 py-1 rounded-full text-sm", __source: { fileName: "", lineNumber: 60, columnNumber: 11 }, __self: this }, "Tattoos Allowed")), /*#__PURE__*/ React.createElement("div", { className: "mt-4 flex gap-3", __source: { fileName: "", lineNumber: 66, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: onViewDetails, className: "rounded-lg bg-[#357AFF] px-4 py-2 text-sm font-medium text-white transition-colors hover:bg-[#2E69DE] focus:outline-none focus:ring-2 focus:ring-[#357AFF] focus:ring-offset-2", __source: { fileName: "", lineNumber: 67, columnNumber: 9 }, __self: this }, "View Details"), isLoggedIn && /*#__PURE__*/ React.createElement("button", { onClick: onSaveJob, className: "rounded-lg border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 transition-colors hover:bg-gray-50 focus:outline-none focus:ring-2 focus:ring-[#357AFF] focus:ring-offset-2", __source: { fileName: "", lineNumber: 74, columnNumber: 11 }, __self: this }, "Save Job"))); } function JobCardStory() { const sampleJob1 = { title: "Senior Software Engineer", agency_id: "Tech Solutions Agency", city: "San Francisco", state: "CA", salary_min: 120000, salary_max: 180000, degree_required: true, job_type: "federal", experience_years: 5, polygraph_required: true, tattoos_allowed: false }; const sampleJob2 = { title: "UX Designer", agency_id: "Creative Design Co", city: "New York", state: "NY", salary_min: 90000, salary_max: 130000, degree_required: false, job_type: "municipality", experience_years: 2, polygraph_required: false, tattoos_allowed: true }; const sampleJob3 = { title: "Marketing Manager", agency_id: "Global Marketing Inc", city: "Chicago", state: "IL", salary_min: 80000, salary_max: 110000, degree_required: true, job_type: "county", experience_years: 3, polygraph_required: false, tattoos_allowed: true }; return /*#__PURE__*/ React.createElement("div", { className: "space-y-4 bg-gray-100 p-4", __source: { fileName: "", lineNumber: 130, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(JobCard, { job: sampleJob1, showDegreeFlag: true, isLoggedIn: true, onViewDetails: ()=>alert('View Details clicked'), onSaveJob: ()=>alert('Save Job clicked'), __source: { fileName: "", lineNumber: 131, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(JobCard, { job: sampleJob2, showDegreeFlag: false, isLoggedIn: true, onViewDetails: ()=>alert('View Details clicked'), onSaveJob: ()=>alert('Save Job clicked'), __source: { fileName: "", lineNumber: 139, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement(JobCard, { job: sampleJob3, showDegreeFlag: true, isLoggedIn: false, onViewDetails: ()=>alert('View Details clicked'), onSaveJob: ()=>alert('Save Job clicked'), __source: { fileName: "", lineNumber: 147, columnNumber: 7 }, __self: this })); } function MainComponent() { const { data: user } = useUser(); const [filters, setFilters] = useState({}); const [sort, setSort] = useState({ sortBy: 'created_at', sortOrder: 'desc' }); const [page, setPage] = useState(1); const [loading, setLoading] = useState(false); const [jobs, setJobs] = useState([]); const [pagination, setPagination] = useState({}); const [isDetailModalOpen, setIsDetailModalOpen] = useState(false); const [selectedJob, setSelectedJob] = useState(null); const [error, setError] = useState(null); const fetchJobs = async ()=>{ setLoading(true); setError(null); try { const response = await fetch('/api/list-jobs', { method: 'POST', headers: { 'Content-Type': 'application/json' }, body: JSON.stringify({ ...filters, ...sort, page, limit: 10 }) }); if (!response.ok) { throw new Error(`Error fetching jobs: ${response.status}`); } const data = await response.json(); setJobs(data.jobs); setPagination(data.pagination); } catch (error) { console.error('Failed to fetch jobs:', error); setError('Failed to load jobs. Please try again later.'); } finally{ setLoading(false); } }; useEffect(()=>{ fetchJobs(); }, [ filters, sort, page ]); const handleViewDetails = (job)=>{ setSelectedJob(job); setIsDetailModalOpen(true); }; const handleSaveJob = (jobId)=>{ if (!user) return; alert("Job saved!"); }; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-50", __source: { fileName: "", lineNumber: 61, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mx-auto max-w-7xl px-4 py-8", __source: { fileName: "", lineNumber: 62, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-6 flex flex-wrap items-center justify-between gap-4", __source: { fileName: "", lineNumber: 63, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-gray-900", __source: { fileName: "", lineNumber: 64, columnNumber: 3 }, __self: this }, "Job Search Results"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap items-center gap-4", __source: { fileName: "", lineNumber: 65, columnNumber: 3 }, __self: this }, /*#__PURE__*/ React.createElement("select", { value: sort.sortBy, onChange: (e)=>setSort((prev)=>({ ...prev, sortBy: e.target.value })), className: "rounded-lg border border-gray-300 bg-white px-4 py-2 text-gray-700 focus:border-[#357AFF] focus:outline-none focus:ring-1 focus:ring-[#357AFF]", __source: { fileName: "", lineNumber: 66, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("option", { value: "created_at", __source: { fileName: "", lineNumber: 71, columnNumber: 7 }, __self: this }, "Newest First"), /*#__PURE__*/ React.createElement("option", { value: "salary_max", __source: { fileName: "", lineNumber: 72, columnNumber: 7 }, __self: this }, "Highest Salary"), /*#__PURE__*/ React.createElement("option", { value: "salary_min", __source: { fileName: "", lineNumber: 73, columnNumber: 7 }, __self: this }, "Lowest Salary")), user && /*#__PURE__*/ React.createElement("button", { onClick: ()=>alert('Save search clicked'), className: "rounded-lg border border-[#357AFF] bg-white px-4 py-2 text-[#357AFF] hover:bg-blue-50", __source: { fileName: "", lineNumber: 76, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bookmark mr-2", __source: { fileName: "", lineNumber: 80, columnNumber: 9 }, __self: this }), "Save Search"))), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col gap-6 lg:flex-row", __source: { fileName: "", lineNumber: 87, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-full lg:w-64", __source: { fileName: "", lineNumber: 88, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement(SearchFilters, { onFilterChange: setFilters, initialFilters: filters, __source: { fileName: "", lineNumber: 89, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex-1", __source: { fileName: "", lineNumber: 95, columnNumber: 11 }, __self: this }, error && /*#__PURE__*/ React.createElement("div", { className: "mb-4 rounded-lg bg-red-50 p-4 text-red-800", __source: { fileName: "", lineNumber: 97, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("p", { __source: { fileName: "", lineNumber: 98, columnNumber: 17 }, __self: this }, error)), loading ? /*#__PURE__*/ React.createElement("div", { className: "flex h-64 items-center justify-center", __source: { fileName: "", lineNumber: 103, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-12 w-12 animate-spin rounded-full border-b-2 border-blue-500", __source: { fileName: "", lineNumber: 104, columnNumber: 17 }, __self: this })) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "mb-4 grid gap-4 md:grid-cols-2", __source: { fileName: "", lineNumber: 108, columnNumber: 17 }, __self: this }, jobs.map((job)=>/*#__PURE__*/ React.createElement(JobCard, { key: job.id, job: job, isLoggedIn: !!user, onViewDetails: ()=>handleViewDetails(job), onSaveJob: ()=>handleSaveJob(job.id), __source: { fileName: "", lineNumber: 110, columnNumber: 21 }, __self: this }))), jobs.length === 0 && !loading && /*#__PURE__*/ React.createElement("div", { className: "py-12 text-center", __source: { fileName: "", lineNumber: 121, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-medium text-gray-900", __source: { fileName: "", lineNumber: 122, columnNumber: 21 }, __self: this }, "No jobs found"), /*#__PURE__*/ React.createElement("p", { className: "mt-2 text-sm text-gray-500", __source: { fileName: "", lineNumber: 123, columnNumber: 21 }, __self: this }, "Try adjusting your filters to see more results")), pagination.pages > 1 && /*#__PURE__*/ React.createElement("div", { className: "mt-8 flex justify-center", __source: { fileName: "", lineNumber: 128, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "inline-flex -space-x-px rounded-md shadow-sm", __source: { fileName: "", lineNumber: 129, columnNumber: 21 }, __self: this }, Array.from({ length: pagination.pages }).map((_, i)=>/*#__PURE__*/ React.createElement("button", { key: i, onClick: ()=>setPage(i + 1), className: `relative inline-flex items-center px-4 py-2 text-sm font-medium ${page === i + 1 ? 'z-10 bg-blue-50 border-blue-500 text-blue-600' : 'bg-white border-gray-300 text-gray-500 hover:bg-gray-50'} ${i === 0 ? 'rounded-l-md' : ''} ${i === pagination.pages - 1 ? 'rounded-r-md' : ''} border `, __source: { fileName: "", lineNumber: 131, columnNumber: 25 }, __self: this }, i + 1)))))))), /*#__PURE__*/ React.createElement(JobDetailModal, { isOpen: isDetailModalOpen, onClose: ()=>setIsDetailModalOpen(false), job: selectedJob, isLoggedIn: !!user, onApply: ()=>alert('Apply clicked'), onSave: ()=>handleSaveJob(selectedJob?.id), __source: { fileName: "", lineNumber: 156, columnNumber: 7 }, __self: this })); }