feat: add review action buttons to job detail page

Show contextual buttons when jobs are ready for review:
- QC Review button (blue) when status is pending_qc
- Final Review button (purple) when status is pending_final_review

Buttons appear dynamically via WebSocket updates without refresh.

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
michael 2025-12-27 07:47:27 -06:00
parent 54799f4662
commit 0eda72fd23

View file

@ -343,6 +343,51 @@ export function JobDetail() {
{/* Tab Content */}
{renderTabContent()}
{/* Review Action Button */}
{job.status === 'pending_qc' && (
<div className="mt-8 bg-blue-50 border border-blue-200 rounded-lg p-6">
<div className="flex items-center justify-between">
<div>
<h3 className="text-lg font-medium text-blue-800">Ready for QC Review</h3>
<p className="text-blue-700 text-sm mt-1">
This job is awaiting quality control review. Review and approve the captions and audio descriptions.
</p>
</div>
<Link
to={`/admin/qc/${job.id}`}
className="inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-md text-white bg-blue-600 hover:bg-blue-700 shadow-sm"
>
<svg className="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2m-6 9l2 2 4-4" />
</svg>
Go to QC Review
</Link>
</div>
</div>
)}
{job.status === 'pending_final_review' && (
<div className="mt-8 bg-purple-50 border border-purple-200 rounded-lg p-6">
<div className="flex items-center justify-between">
<div>
<h3 className="text-lg font-medium text-purple-800">Ready for Final Review</h3>
<p className="text-purple-700 text-sm mt-1">
All translations and audio are complete. Perform the final review before delivery.
</p>
</div>
<Link
to={`/admin/final/${job.id}`}
className="inline-flex items-center px-6 py-3 border border-transparent text-base font-medium rounded-md text-white bg-purple-600 hover:bg-purple-700 shadow-sm"
>
<svg className="w-5 h-5 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M5 13l4 4L19 7" />
</svg>
Go to Final Review
</Link>
</div>
</div>
)}
</div>
{/* Sidebar */}