koperasi/services/frontend/app/routes/dashboard.saldo.top-up/route.tsx
2025-08-08 14:12:40 +07:00

46 lines
1.3 KiB
TypeScript

import PageContainer from "~/components/page-container";
import { DataTable } from "~/components/table/data-table";
import { useGetAllTopUp } from "~/services/top-up/get-all";
import { columns } from "./components/table/columns";
import { useMemo } from "react";
import Spinner from "~/components/ui/spinner";
export default function TopUpPage() {
const { data, isLoading } = useGetAllTopUp({});
const filteredData = useMemo(() => {
if (!data) return [];
return data.filter((item) =>
[
"SIMPANAN POKOK",
"SIMPANAN WAJIB",
"TOPUP SALDO",
"UPGRADE USER",
].includes(item.topup.jenis || "")
);
}, [data]);
return (
<PageContainer>
<div className="space-y-4">
<div className="flex items-center justify-between space-y-2">
<h2 className="font-bold text-2xl tracking-tight">Top Up</h2>
</div>
<div className="space-y-3 overflow-hidden rounded-md bg-white p-5 shadow-md">
{isLoading ? (
<div className="mx-auto flex items-center justify-center">
<Spinner />
</div>
) : (
<DataTable
columns={columns}
data={filteredData}
searchKey="topup_nama"
searchLabel="Nama User"
/>
)}
</div>
</div>
</PageContainer>
);
}