Make dashboard cards clickable
- Families → /admin/families - Users → /admin/users - Children → /admin/children - MRR → /admin/revenue Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
parent
26af4b9318
commit
40c3dcf33f
1 changed files with 11 additions and 2 deletions
|
|
@ -86,24 +86,28 @@ export default function AdminDashboard() {
|
|||
value={stats.overview.totalFamilies}
|
||||
icon="🏠"
|
||||
color="rose"
|
||||
href="/admin/families"
|
||||
/>
|
||||
<StatCard
|
||||
label="Total Users"
|
||||
value={stats.overview.totalUsers}
|
||||
icon="👥"
|
||||
color="blue"
|
||||
href="/admin/users"
|
||||
/>
|
||||
<StatCard
|
||||
label="Total Children"
|
||||
value={stats.overview.totalChildren}
|
||||
icon="👶"
|
||||
color="amber"
|
||||
href="/admin/children"
|
||||
/>
|
||||
<StatCard
|
||||
label="MRR"
|
||||
value={`$${stats.overview.mrr.toFixed(2)}`}
|
||||
icon="💰"
|
||||
color="emerald"
|
||||
href="/admin/revenue"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
|
@ -174,7 +178,7 @@ export default function AdminDashboard() {
|
|||
);
|
||||
}
|
||||
|
||||
function StatCard({ label, value, icon, color }: { label: string; value: number | string; icon: string; color: string }) {
|
||||
function StatCard({ label, value, icon, color, href }: { label: string; value: number | string; icon: string; color: string; href?: string }) {
|
||||
const colorClasses: Record<string, string> = {
|
||||
rose: "text-rose-400",
|
||||
blue: "text-blue-400",
|
||||
|
|
@ -182,7 +186,7 @@ function StatCard({ label, value, icon, color }: { label: string; value: number
|
|||
emerald: "text-emerald-400",
|
||||
};
|
||||
|
||||
return (
|
||||
const content = (
|
||||
<div className="bg-gray-800 p-6 rounded-xl">
|
||||
<div className="flex items-center justify-between mb-2">
|
||||
<span className="text-2xl">{icon}</span>
|
||||
|
|
@ -191,6 +195,11 @@ function StatCard({ label, value, icon, color }: { label: string; value: number
|
|||
<div className="text-gray-400 text-sm">{label}</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
if (href) {
|
||||
return <a href={href} className="cursor-pointer hover:opacity-90 transition-opacity">{content}</a>;
|
||||
}
|
||||
return content;
|
||||
}
|
||||
|
||||
function ChartCard({ title, data, icon }: { title: string; data: { date: string; count: number }[]; icon: string }) {
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue