sarlink/sarlink-portal
7
0
Fork 0
mirror of https://github.com/i701/sarlink-portal.git synced 2025-07-08 14:55:07 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Merge pull request #12 from i701/feat/wallet-topups
All checks were successful
Build and Push Docker Images / Build and Push Docker Images (push) Successful in 4m59s
Details

Browse Source 
refactor: enhance topup status display and improve conditional rendering in TopupsTable component 🔨
This commit is contained in:
Abdulla Aidhaan
2025-07-06 20:16:27 +05:00
committed by GitHub
parent b3805feefe 8c94c92281
commit 62678b6a84
1 changed files with 35 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

36
components/topups-table.tsx
View File

@ -103,8 +103,8 @@ export async function TopupsTable({
View Details
</Button>
</Link>
{!topup.is_expired && (
{!topup.is_expired &&
topup.status !== "CANCELLED" && (
<Badge
className={cn(
topup?.paid
@ -123,7 +123,12 @@ export async function TopupsTable({
<TableCell>
<span className="font-semibold pr-2">
{topup.paid ? (
<Badge className="bg-green-100 dark:bg-green-700" variant="outline">{topup.status}</Badge>
<Badge
className="bg-green-100 dark:bg-green-700"
variant="outline"
>
{topup.status}
</Badge>
) : topup.is_expired ? (
<Badge>Expired</Badge>
) : (
@ -144,19 +149,14 @@ export async function TopupsTable({
<TableRow>
<TableCell colSpan={4} className="text-muted-foreground">
{meta?.total === 1 ? (
<p className="text-center">
Total {meta?.total} topup.
</p>
<p className="text-center">Total {meta?.total} topup.</p>
) : (
<p className="text-center">
Total {meta?.total} topups.
</p>
<p className="text-center">Total {meta?.total} topups.</p>
)}
</TableCell>
</TableRow>
</TableFooter>
</Table>
</div>
<div className="sm:hidden block">
{data.map((topup) => (
@ -203,7 +203,7 @@ function MobileTopupDetails({ topup }: { topup: Topup }) {
View Details
</Button>
</Link>
{topup.status !== "CANCELLED" && (
{!topup.is_expired && topup.status !== "CANCELLED" && (
<Badge
className={cn(
topup?.paid
@ -216,13 +216,25 @@ function MobileTopupDetails({ topup }: { topup: Topup }) {
</Badge>
)}
</div>
<div className="bg-white dark:bg-black p-2 rounded mt-2 w-full border">
<div className="bg-white dark:bg-black p-2 rounded mt-2 w-full border flex justify-between items-center">
<div className="block sm:hidden">
<h3 className="text-sm font-medium">Amount</h3>
<span className="text-sm text-muted-foreground">
{topup.amount.toFixed(2)} MVR
</span>
</div>
<span className="font-semibold pr-2">
{topup.paid ? (
<Badge className="bg-green-100 dark:bg-green-700" variant="outline">
{topup.status}
</Badge>
) : topup.is_expired ? (
<Badge>Expired</Badge>
) : (
<Badge variant="secondary">{topup.status}</Badge>
)}
</span>
</div>
</div>
);