50 lines
1.3 KiB
TypeScript
50 lines
1.3 KiB
TypeScript
"use client";
|
|
import { useTranslations } from "next-intl";
|
|
import { lazy, Suspense, useState } from "react";
|
|
import type { useFurnitureJobs } from "./use-furniture-jobs";
|
|
|
|
const HistoryBody = lazy(() =>
|
|
import("./furniture-job-history-body").then((module) => ({
|
|
default: module.FurnitureJobHistoryBody,
|
|
})),
|
|
);
|
|
export function FurnitureJobHistory({
|
|
state,
|
|
expanded = false,
|
|
}: {
|
|
state: ReturnType<typeof useFurnitureJobs>;
|
|
expanded?: boolean;
|
|
}) {
|
|
const t = useTranslations("pages.admin.importHistory");
|
|
const common = useTranslations("pages.admin.housekeeping");
|
|
const [opened, setOpened] = useState(expanded);
|
|
return (
|
|
<details
|
|
open={expanded || undefined}
|
|
onToggle={(event) => {
|
|
if (event.currentTarget.open) setOpened(true);
|
|
}}
|
|
className="shrink-0 border-b border-[var(--admin-border)] bg-[var(--admin-surface)] px-4 py-2 text-sm"
|
|
>
|
|
<summary className="cursor-pointer">
|
|
{t("summary", {
|
|
count: state.jobs.filter(
|
|
(job) => job.state === "queued" || job.state === "running",
|
|
).length,
|
|
})}
|
|
</summary>
|
|
{(opened || expanded) && (
|
|
<Suspense
|
|
fallback={
|
|
<p role="status" className="py-2">
|
|
{common("loading")}
|
|
</p>
|
|
}
|
|
>
|
|
<HistoryBody state={state} expanded={expanded} />
|
|
</Suspense>
|
|
)}
|
|
</details>
|
|
);
|
|
}
|