712b06f118
Complete personal finance management application with: - Dashboard with financial metrics and alerts - Credit card management and payments - Fixed and variable debt tracking - Monthly budget planning - Intelligent alert system - Responsive design with Tailwind CSS Tech stack: Next.js 14, TypeScript, Zustand, Recharts 🤖 Generated with [Claude Code](https://claude.com/claude-code)
28 lines
811 B
TypeScript
28 lines
811 B
TypeScript
'use client';
|
|
|
|
import { Sidebar, Header, MobileNav } from '@/components/layout';
|
|
import { CardSection } from '@/components/cards';
|
|
import { useSidebar } from '@/app/providers';
|
|
import { useAlerts } from '@/components/alerts';
|
|
|
|
export default function CardsPage() {
|
|
const { isOpen, toggle, close } = useSidebar();
|
|
const { unreadCount } = useAlerts();
|
|
|
|
return (
|
|
<div className="min-h-screen bg-slate-950">
|
|
<Sidebar isOpen={isOpen} onClose={close} unreadAlertsCount={unreadCount} />
|
|
|
|
<div className="lg:ml-64 min-h-screen flex flex-col">
|
|
<Header onMenuClick={toggle} title="Tarjetas de Crédito" />
|
|
|
|
<main className="flex-1 p-4 md:p-6 lg:p-8 pb-20">
|
|
<CardSection />
|
|
</main>
|
|
</div>
|
|
|
|
<MobileNav unreadAlertsCount={unreadCount} />
|
|
</div>
|
|
);
|
|
}
|