'use client';

// Ops generation-task management — the dedicated interface for background
// generation tasks (single-courseware jobs + large-course records).
//
// Moved out of the home page: the home page is now a pure generation entry,
// while task progress / cancel / resume / delete / open live here.

import { ArrowLeft, Hammer } from 'lucide-react';
import { useRouter } from 'next/navigation';
import { Button } from '@/components/ui/button';
import { GenerationJobsPanel } from '@/components/classroom/generation-jobs-panel';
import { useI18n } from '@/lib/hooks/use-i18n';

export default function TasksPage() {
  const { t } = useI18n();
  const router = useRouter();

  return (
    <main className="min-h-screen bg-zinc-50 dark:bg-zinc-950">
      <div className="mx-auto max-w-4xl px-6 py-10">
        <header className="flex items-center justify-between mb-6">
          <div>
            <h1 className="flex items-center gap-2 text-xl font-semibold">
              <Hammer className="w-5 h-5 text-violet-500" />
              {t('jobs.title')}
            </h1>
            <p className="text-sm text-muted-foreground mt-1">{t('jobs.subtitle')}</p>
          </div>
          <Button variant="outline" size="sm" onClick={() => router.push('/')}>
            <ArrowLeft className="w-4 h-4" />
            {t('common.back')}
          </Button>
        </header>

        <GenerationJobsPanel limit={50} />
      </div>
    </main>
  );
}