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
805 B
TypeScript
28 lines
805 B
TypeScript
'use client'
|
|
|
|
import { Sidebar, Header, MobileNav } from '@/components/layout'
|
|
import { BudgetSection } from '@/components/budget'
|
|
import { useSidebar } from '@/app/providers'
|
|
import { useAlerts } from '@/components/alerts'
|
|
|
|
export default function BudgetPage() {
|
|
const { isOpen, close, toggle } = useSidebar()
|
|
const { unreadCount } = useAlerts()
|
|
|
|
return (
|
|
<div className="flex min-h-screen bg-slate-950">
|
|
<Sidebar isOpen={isOpen} onClose={close} unreadAlertsCount={unreadCount} />
|
|
|
|
<div className="flex-1 flex flex-col min-h-screen">
|
|
<Header onMenuClick={toggle} title="Presupuesto" />
|
|
|
|
<main className="flex-1 p-4 md:p-6 lg:p-8 pb-20">
|
|
<BudgetSection />
|
|
</main>
|
|
|
|
<MobileNav unreadAlertsCount={unreadCount} />
|
|
</div>
|
|
</div>
|
|
)
|
|
}
|