Changes
Co-authored-by: renee-png <262607627+renee-png@users.noreply.github.com>
This commit is contained in:
co-authored by
renee-png
parent
7fe8964390
commit
7bc546b69b
+58
-29
@@ -183,36 +183,65 @@ function Dashboard() {
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
{/* Recent payments (moved to top) */}
|
||||
<Card className="mb-6">
|
||||
<CardHeader className="flex flex-row items-center justify-between">
|
||||
<CardTitle className="text-base flex items-center gap-2">
|
||||
<CreditCard className="h-4 w-4" />
|
||||
Recent payments
|
||||
</CardTitle>
|
||||
<Button asChild variant="ghost" size="sm">
|
||||
<Link to="/payments">View all <ArrowRight className="h-3 w-3 ml-1" /></Link>
|
||||
</Button>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-1">
|
||||
{recentPayments.length === 0 && <p className="text-sm text-muted-foreground">No payment requests yet.</p>}
|
||||
{recentPayments.map((p) => (
|
||||
<Link key={p.id} to="/pay/$id" params={{ id: p.id }} search={{} as never}
|
||||
className="flex items-center justify-between py-2.5 px-2 rounded-md hover:bg-muted/60 -mx-2">
|
||||
<div className="min-w-0">
|
||||
<div className="text-sm font-medium truncate">{p.recipient_name}</div>
|
||||
<div className="text-xs text-muted-foreground truncate">
|
||||
{p.description || "Payment request"} · {formatDate(p.paid_at || p.created_at)}
|
||||
{/* Recent payments + Upcoming reminders */}
|
||||
<div className="grid lg:grid-cols-[2fr_1fr] gap-6 mb-6">
|
||||
<Card>
|
||||
<CardHeader className="flex flex-row items-center justify-between">
|
||||
<CardTitle className="text-base flex items-center gap-2">
|
||||
<CreditCard className="h-4 w-4" />
|
||||
Recent payments
|
||||
</CardTitle>
|
||||
<Button asChild variant="ghost" size="sm">
|
||||
<Link to="/payments">View all <ArrowRight className="h-3 w-3 ml-1" /></Link>
|
||||
</Button>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-1">
|
||||
{recentPayments.length === 0 && <p className="text-sm text-muted-foreground">No payment requests yet.</p>}
|
||||
{recentPayments.map((p) => (
|
||||
<Link key={p.id} to="/pay/$id" params={{ id: p.id }} search={{} as never}
|
||||
className="flex items-center justify-between py-2.5 px-2 rounded-md hover:bg-muted/60 -mx-2">
|
||||
<div className="min-w-0">
|
||||
<div className="text-sm font-medium truncate">{p.recipient_name}</div>
|
||||
<div className="text-xs text-muted-foreground truncate">
|
||||
{p.description || "Payment request"} · {formatDate(p.paid_at || p.created_at)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="text-sm font-medium">{formatCurrency((p.total_amount_cents ?? 0) / 100)}</span>
|
||||
<Badge variant="outline" className={statusBadgeClass(p.status)}>{p.status}</Badge>
|
||||
</div>
|
||||
</Link>
|
||||
))}
|
||||
</CardContent>
|
||||
</Card>
|
||||
<div className="flex items-center gap-2">
|
||||
<span className="text-sm font-medium">{formatCurrency((p.total_amount_cents ?? 0) / 100)}</span>
|
||||
<Badge variant="outline" className={statusBadgeClass(p.status)}>{p.status}</Badge>
|
||||
</div>
|
||||
</Link>
|
||||
))}
|
||||
</CardContent>
|
||||
</Card>
|
||||
|
||||
<Card>
|
||||
<CardHeader>
|
||||
<CardTitle className="text-base flex items-center gap-2">
|
||||
<Bell className="h-4 w-4" />
|
||||
Upcoming reminders
|
||||
</CardTitle>
|
||||
</CardHeader>
|
||||
<CardContent className="space-y-1">
|
||||
{upcomingReminders.length === 0 && (
|
||||
<p className="text-sm text-muted-foreground">No upcoming reminders.</p>
|
||||
)}
|
||||
{upcomingReminders.map((r: any) => (
|
||||
<Link
|
||||
key={r.id}
|
||||
to="/tasks"
|
||||
search={{ task: r.task?.id } as never}
|
||||
className="block py-2 px-2 -mx-2 rounded-md hover:bg-muted/60"
|
||||
>
|
||||
<div className="text-sm font-medium truncate">{r.task?.title ?? "Task"}</div>
|
||||
<div className="text-xs text-muted-foreground truncate">
|
||||
{format(new Date(r.remind_at), "MMM d, h:mm a")} · {r.recipient_email}
|
||||
</div>
|
||||
</Link>
|
||||
))}
|
||||
</CardContent>
|
||||
</Card>
|
||||
</div>
|
||||
|
||||
{/* Financial + My tasks */}
|
||||
<div className="grid lg:grid-cols-[2fr_1fr] gap-6 mb-6">
|
||||
|
||||
Reference in New Issue
Block a user