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)
33 lines
926 B
TypeScript
33 lines
926 B
TypeScript
'use client'
|
|
|
|
import { Sidebar, Header, MobileNav } from '@/components/layout'
|
|
import { DebtSection } from '@/components/debts'
|
|
import { useSidebar } from '@/app/providers'
|
|
import { useAlerts } from '@/components/alerts'
|
|
|
|
export default function DebtsPage() {
|
|
const { isOpen, close, open } = useSidebar()
|
|
const { unreadCount } = useAlerts()
|
|
|
|
return (
|
|
<div className="min-h-screen bg-slate-950">
|
|
{/* Sidebar */}
|
|
<Sidebar isOpen={isOpen} onClose={close} unreadAlertsCount={unreadCount} />
|
|
|
|
{/* Main content */}
|
|
<div className="lg:ml-64 min-h-screen flex flex-col">
|
|
{/* Header */}
|
|
<Header onMenuClick={open} title="Deudas" />
|
|
|
|
{/* Page content */}
|
|
<main className="flex-1 p-4 md:p-6 lg:p-8 pb-20 lg:pb-8">
|
|
<DebtSection />
|
|
</main>
|
|
</div>
|
|
|
|
{/* Mobile Navigation */}
|
|
<MobileNav unreadAlertsCount={unreadCount} />
|
|
</div>
|
|
)
|
|
}
|