\n {/* Filters */}\n

\n {/* Search */}\n \n\n {/* Status Filter */}\n

\n handleFilterByStatus(undefined)}\n className={`px-3 py-1 rounded-full text-sm font-medium transition-colors ${\n !filters.status \n ? 'bg-blue-100 text-blue-800' \n : 'bg-gray-100 text-gray-700 hover:bg-gray-200'\n }`}\n >\n All\n \n {statusOptions.map(option => (\n handleFilterByStatus(option.value)}\n className={`px-3 py-1 rounded-full text-sm font-medium transition-colors ${\n filters.status === option.value \n ? option.color \n : 'bg-gray-100 text-gray-700 hover:bg-gray-200'\n }`}\n >\n {option.label}\n \n ))}\n

\n\n {/* Job List */}\n

\n {loading && jobs.length === 0 ? (\n

\n Loading jobs...\n

\n ) : jobs.length === 0 ? (\n

📋

No job postings found

Start by adding your first job posting above.

\n ) : (\n jobs.map((job) => (\n

\n {job.position}\n

\n {getStatusBadge(job.status)}\n

\n \n

\n {job.company}\n •\n {job.location}\n {job.salary && (\n <>\n •\n {job.salary}\n \n )}\n

\n\n

\n Applied: {formatDate(job.applicationDate)}\n {job.createdAt && job.createdAt !== job.applicationDate && (\n \n Added: {formatDate(job.createdAt)}\n \n )}\n

\n\n {job.description && (\n

\n {job.description}\n

\n )}\n\n {job.notes && (\n

\n Notes: {job.notes}\n

\n )}\n\n

\n {job.url && (\n \n View Posting →\n \n )}\n

\n\n

\n {/* Status Dropdown */}\n handleStatusUpdate(job.id!, e.target.value as JobStatus)}\n className=\"text-sm border border-gray-300 rounded px-2 py-1 focus:ring-2 focus:ring-blue-500 focus:border-blue-500\"\n >\n {statusOptions.map(option => (\n \n ))}\n \n\n {/* Delete Button */}\n handleDelete(job.id!)}\n className=\"text-red-600 hover:text-red-800 p-1 rounded\"\n title=\"Delete job posting\"\n >\n \n \n

\n ))\n )}\n

\n );\n}","deleted","label",[170,171,153],"frontend","components","permalink","https://www.val.town/x/Ephie98/untitled-6440/code/frontend/components/JobList.tsx","extension","actionData","errors"]