38 lines
1.2 KiB
TypeScript
38 lines
1.2 KiB
TypeScript
import { ArrowLeft } from "lucide-react";
|
|
import { Link, useParams } from "react-router";
|
|
import { useDownloadTask } from "~/api/downloads.ts";
|
|
import { ErrorState, LoadingState } from "~/components/console/empty-state.tsx";
|
|
import { PageHeader } from "~/components/console/page-header.tsx";
|
|
import { DownloadDetail } from "~/components/downloads/download-detail.tsx";
|
|
import { Button } from "~/components/ui/button.tsx";
|
|
|
|
export default function DownloadTaskPage() {
|
|
const { id = "" } = useParams();
|
|
const task = useDownloadTask(id);
|
|
return (
|
|
<>
|
|
<PageHeader
|
|
title={task.data?.name ?? "下载任务"}
|
|
className="[&_h1]:break-all"
|
|
actions={
|
|
<Button asChild variant="ghost" size="sm">
|
|
<Link to="/console/tasks">
|
|
<ArrowLeft />
|
|
下载与任务
|
|
</Link>
|
|
</Button>
|
|
}
|
|
/>
|
|
<div className="pg-slab rounded-xl p-4 md:p-5">
|
|
{task.isPending ? (
|
|
<LoadingState rows={5} />
|
|
) : task.error ? (
|
|
<ErrorState plain error={task.error} onRetry={() => void task.refetch()} />
|
|
) : (
|
|
<DownloadDetail task={task.data} />
|
|
)}
|
|
</div>
|
|
</>
|
|
);
|
|
}
|