mirror of
https://github.com/i701/sarlink-portal.git
synced 2025-07-10 04:56:31 +00:00
fix: pagination in PaymentsTable and TopupsTable components 🐛
All checks were successful
Build and Push Docker Images / Build and Push Docker Images (push) Successful in 7m35s
All checks were successful
Build and Push Docker Images / Build and Push Docker Images (push) Successful in 7m35s
This commit is contained in:
@ -25,20 +25,19 @@ export default async function TopupPage({
|
|||||||
<div className="flex justify-between items-center border rounded-md border-dashed font-bold title-bg py-4 px-4 mb-4 mx-2">
|
<div className="flex justify-between items-center border rounded-md border-dashed font-bold title-bg py-4 px-4 mb-4 mx-2">
|
||||||
<h3 className="text-sarLinkOrange text-2xl">Topup</h3>
|
<h3 className="text-sarLinkOrange text-2xl">Topup</h3>
|
||||||
<div className="flex flex-col gap-4 items-end w-full">
|
<div className="flex flex-col gap-4 items-end w-full">
|
||||||
{!topup.is_expired ||
|
{!topup.is_expired && topup.paid && topup.status !== "PENDING" && (
|
||||||
(topup.status !== "PENDING" && (
|
<Button
|
||||||
<Button
|
disabled
|
||||||
disabled
|
className={cn(
|
||||||
className={cn(
|
"rounded-md opacity-100! uppercase font-semibold",
|
||||||
"rounded-md opacity-100! uppercase font-semibold",
|
topup?.paid
|
||||||
// topup?.paid
|
? "text-green-900 bg-green-500/20"
|
||||||
// ? "text-green-900 bg-green-500/20"
|
: "text-inherit bg-yellow-400",
|
||||||
// : "text-inherit bg-yellow-400",
|
)}
|
||||||
)}
|
>
|
||||||
>
|
{topup.status}
|
||||||
{topup?.paid ? <span>Paid</span> : ""}
|
</Button>
|
||||||
</Button>
|
)}
|
||||||
))}
|
|
||||||
{topup.status === "PENDING" && !topup.is_expired && (
|
{topup.status === "PENDING" && !topup.is_expired && (
|
||||||
<Button>
|
<Button>
|
||||||
<TextShimmer>Payment Pending</TextShimmer>{" "}
|
<TextShimmer>Payment Pending</TextShimmer>{" "}
|
||||||
@ -62,20 +61,20 @@ export default async function TopupPage({
|
|||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
{
|
{!topup.paid && topup.status === "PENDING" && !topup.is_expired && (
|
||||||
(!topup.paid && topup.status === "PENDING" && !topup.is_expired) && (
|
<ExpiryCountDown expiryLabel="Top up" expiresAt={topup.expires_at} />
|
||||||
<ExpiryCountDown expiryLabel="Top up" expiresAt={topup.expires_at} />
|
)}
|
||||||
)
|
|
||||||
}
|
|
||||||
<div
|
<div
|
||||||
id="user-topup-details"
|
id="user-topup-details"
|
||||||
className="pb-4 gap-4 flex sm:flex-row flex-col items-start justify-start"
|
className="pb-4 gap-4 flex sm:flex-row flex-col items-start justify-start"
|
||||||
>
|
>
|
||||||
<TopupToPay
|
<TopupToPay
|
||||||
disabled={topup.paid || topup.is_expired || topup.status === "CANCELLED"}
|
disabled={
|
||||||
|
topup.paid || topup.is_expired || topup.status === "CANCELLED"
|
||||||
|
}
|
||||||
topup={topup || undefined}
|
topup={topup || undefined}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div >
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
@ -52,7 +52,6 @@ export async function DevicesTable({
|
|||||||
}
|
}
|
||||||
apiParams.limit = limit;
|
apiParams.limit = limit;
|
||||||
apiParams.offset = offset;
|
apiParams.offset = offset;
|
||||||
console.log("API Params:", apiParams);
|
|
||||||
const [error, devices] = await tryCatch(
|
const [error, devices] = await tryCatch(
|
||||||
getDevices(apiParams),
|
getDevices(apiParams),
|
||||||
);
|
);
|
||||||
|
@ -28,12 +28,17 @@ export async function PaymentsTable({
|
|||||||
}>;
|
}>;
|
||||||
}) {
|
}) {
|
||||||
const resolvedParams = await searchParams;
|
const resolvedParams = await searchParams;
|
||||||
|
const page = Number.parseInt(resolvedParams.page as string) || 1;
|
||||||
|
const limit = 10;
|
||||||
|
const offset = (page - 1) * limit;
|
||||||
const apiParams: Record<string, string | number | undefined> = {};
|
const apiParams: Record<string, string | number | undefined> = {};
|
||||||
for (const [key, value] of Object.entries(resolvedParams)) {
|
for (const [key, value] of Object.entries(resolvedParams)) {
|
||||||
if (value !== undefined && value !== "") {
|
if (value !== undefined && value !== "") {
|
||||||
apiParams[key] = typeof value === "number" ? value : String(value);
|
apiParams[key] = typeof value === "number" ? value : String(value);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
apiParams.limit = limit;
|
||||||
|
apiParams.offset = offset;
|
||||||
const [error, payments] = await tryCatch(getPayments(apiParams));
|
const [error, payments] = await tryCatch(getPayments(apiParams));
|
||||||
|
|
||||||
if (error) {
|
if (error) {
|
||||||
@ -166,7 +171,7 @@ export async function PaymentsTable({
|
|||||||
</TableFooter>
|
</TableFooter>
|
||||||
</Table>
|
</Table>
|
||||||
<Pagination
|
<Pagination
|
||||||
totalPages={meta.total / meta.per_page}
|
totalPages={meta.last_page}
|
||||||
currentPage={meta.current_page}
|
currentPage={meta.current_page}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
@ -27,7 +27,9 @@ export async function TopupsTable({
|
|||||||
}>;
|
}>;
|
||||||
}) {
|
}) {
|
||||||
const resolvedParams = await searchParams;
|
const resolvedParams = await searchParams;
|
||||||
|
const page = Number.parseInt(resolvedParams.page as string) || 1;
|
||||||
|
const limit = 10;
|
||||||
|
const offset = (page - 1) * limit;
|
||||||
// Build params object
|
// Build params object
|
||||||
const apiParams: Record<string, string | number | undefined> = {};
|
const apiParams: Record<string, string | number | undefined> = {};
|
||||||
for (const [key, value] of Object.entries(resolvedParams)) {
|
for (const [key, value] of Object.entries(resolvedParams)) {
|
||||||
@ -35,7 +37,8 @@ export async function TopupsTable({
|
|||||||
apiParams[key] = typeof value === "number" ? value : String(value);
|
apiParams[key] = typeof value === "number" ? value : String(value);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
apiParams.limit = limit;
|
||||||
|
apiParams.offset = offset;
|
||||||
const [error, topups] = await tryCatch(getTopups(apiParams));
|
const [error, topups] = await tryCatch(getTopups(apiParams));
|
||||||
|
|
||||||
if (error) {
|
if (error) {
|
||||||
@ -151,8 +154,8 @@ export async function TopupsTable({
|
|||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
<Pagination
|
<Pagination
|
||||||
totalPages={meta.total / meta.per_page}
|
totalPages={meta?.last_page}
|
||||||
currentPage={meta.current_page}
|
currentPage={meta?.current_page}
|
||||||
/>
|
/>
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
Reference in New Issue
Block a user