\n Showing jobs {startIdx + 1}-{Math.min(endIdx, jobs.length)} of {jobs.length}\n

\n\n

\n \n \n \n {columns.map(column => (\n \n requestSort(column.key)}\n className=\"w-full flex items-center justify-between hover:bg-gray-800 group\"\n >\n {column.label}\n \n \n \n ))}\n \n \n \n {sortedJobs.slice(startIdx, endIdx).map(job => (\n onSelectJob(job)}\n className=\"hover:bg-gray-800 cursor-pointer border-b border-gray-700 last:border-b-0\"\n >\n \n \n \n \n \n {job.error || \"-\"}\n \n \n {job.result || \"-\"}\n \n \n \n ))}\n \n

{job.id}	{job.type}	\n {job.status}\n	\n {job.args}\n	\n {Math.floor(job.runtime / 60)}m {job.runtime % 60}s\n

\n\n

\n onPageChange(currentPage - 1)}\n disabled={currentPage === 0}\n className=\"px-3 py-1 disabled:opacity-50 disabled:cursor-not-allowed hover:bg-gray-800\"\n >\n ◀\n \n \n Page {currentPage + 1} of {Math.ceil(jobs.length / itemsPerPage)}\n \n onPageChange(currentPage + 1)}\n disabled={currentPage >= Math.ceil(jobs.length / itemsPerPage) - 1}\n className=\"px-3 py-1 disabled:opacity-50 disabled:cursor-not-allowed hover:bg-gray-800\"\n >\n ▶\n \n

\n );\n};\n\nconst JobDetail = ({ job, onClose }) => {\n if (!job) return null;\n\n return (\n

\n Job Details: {job.id}\n \n

\n{`STATUS    : ${job.status}\nTYPE      : ${job.type}\nRUNTIME   : ${Math.floor(job.runtime / 60)}m ${job.runtime % 60}s\nCREATED   : ${new Date(job.created).toLocaleString()}\nARGS      : ${job.args}\n${job.error ? `ERROR     : ${job.error}` : ''}\n${job.result ? `RESULT    : ${job.result}` : ''}\n\nLOGS:\n${job.status === 'FAILED' ?\n  `[ERROR] Task execution failed: ${job.error}\\n[ERROR] Retry attempt 1/3 failed\\n[ERROR] Job terminated with exit code 1` :\n  job.status === 'COMPLETED' ?\n  `[INFO] Task initialized successfully\\n[INFO] Processing batch data\\n[INFO] ${job.result}` :\n  `[INFO] Task initialized successfully\\n[INFO] Processing batch data\\n[INFO] In progress...`\n}`}\n

\n );\n};\n\nconst QueueInterface = () => {\n const [currentPage, setCurrentPage] = useState(0);\n const [selectedJob, setSelectedJob] = useState(null);\n const itemsPerPage = 10;\n\n return (\n

Queue Management System

\n \n setSelectedJob(null)} />\n

\n );\n};\n\nexport default QueueInterface;\n\ncreateRoot(document.getElementById(\"root\")).render();","deleted","label",[98],"permalink","https://www.val.town/x/maxm/queue/code/client.ts","extension","actionData","errors"]