koperasi/services/frontend/app/routes/app.riwayat-laporan.$id/components/first-section.tsx
2025-08-08 14:12:40 +07:00

33 lines
1.0 KiB
TypeScript

import { DataTable } from "~/components/table/data-table";
import Spinner from "~/components/ui/spinner";
import { useGetReportByProjectId } from "~/services/project-report/get-by-project-id";
import { columns } from "./table/columns";
interface Props {
id: string | number;
}
export default function FirstSection({ id }: Props) {
const { data, isLoading } = useGetReportByProjectId({ id, jenis_laporan: "UNTUNG" });
return (
<section className="order-2 min-w-96 flex-1 space-y-6 rounded-md bg-white p-6 transition-all xl:order-1">
<div className="space-y-3 overflow-hidden rounded-md ">
{isLoading ? (
<div className="flex h-40 items-center justify-center">
<Spinner />
</div>
) : data ? (
<DataTable
columns={columns}
data={data.projectReport}
searchKey="judul"
searchLabel="judul laporan"
/>
) : (
<div className="text-center">Tidak ada data yang ditemukan.</div>
)}
</div>
</section>
);
}