Display and edit parallel jobs on card

Display the parallel jobs value on the job card and enable editing by clicking on it.
This commit is contained in:
gpt-engineer-app[bot]
2025-07-12 10:50:35 +00:00
committed by PhatPhuckDave
parent 51467925f3
commit b1925331ed

View File

@@ -54,9 +54,16 @@ const JobCardDetails: React.FC<JobCardDetailsProps> = ({ job }) => {
const handleFieldUpdate = async (fieldName: string, value: string) => {
try {
const dateValue = value ? new Date(value).toISOString() : null;
await updateJob(job.id, { [fieldName]: dateValue });
let updateValue: any;
if (fieldName === 'parallel') {
updateValue = Math.max(1, parseInt(value) || 1);
} else {
updateValue = value ? new Date(value).toISOString() : null;
}
await updateJob(job.id, { [fieldName]: updateValue });
setEditingField(null);
setTempValues({});
toast({
title: "Updated",
description: `${fieldName} updated successfully`,
@@ -195,8 +202,40 @@ const JobCardDetails: React.FC<JobCardDetailsProps> = ({ job }) => {
<Clock className="w-4 h-4" />
<span>Runtime:</span>
</div>
<div className="text-sm text-white">
<div className="text-sm text-white flex items-center gap-1">
{formatDuration(job.runtime)}
<span className="text-gray-400">(</span>
{editingField === 'parallel' ? (
<Input
type="number"
min="1"
value={tempValues.parallel || job.parallel?.toString() || '1'}
onChange={(e) => setTempValues({ ...tempValues, parallel: e.target.value })}
onBlur={() => handleFieldUpdate('parallel', tempValues.parallel || '1')}
onKeyDown={(e) => {
if (e.key === 'Enter') {
handleFieldUpdate('parallel', tempValues.parallel || '1');
} else if (e.key === 'Escape') {
setEditingField(null);
setTempValues({});
}
}}
className="w-12 h-5 px-1 py-0 text-xs bg-gray-800 border-gray-600"
autoFocus
/>
) : (
<span
className="cursor-pointer hover:text-blue-400 transition-colors"
onClick={(e) => {
e.stopPropagation();
setEditingField('parallel');
setTempValues({ parallel: job.parallel?.toString() || '1' });
}}
>
{job.parallel || 1}
</span>
)}
<span className="text-gray-400">)</span>
</div>
{job.status === 'Running' && (