Dashboard

Overview of your financial status

\n\n {/* Summary Cards */}\n

\n {/* Total Balance */}\n

Total Balance

\n {formatCurrency(data.balance)}\n

💰

\n\n {/* Monthly Income */}\n

Monthly Income

\n {formatCurrency(data.monthlyIncome)}\n

📈

\n\n {/* Monthly Expenses */}\n

Monthly Expenses

\n {formatCurrency(data.monthlyExpenses)}\n

📉

\n\n {/* Monthly Net */}\n

Monthly Net

\n {formatCurrency(data.monthlyNet)}\n

⚖️

\n\n {/* Budget Overview */}\n {data.categorySpending.length > 0 && (\n

Budget Overview

\n {data.categorySpending.slice(0, 5).map((category, index) => (\n

\n {category.category}\n

\n \n {formatCurrency(category.spent)} / {formatCurrency(category.budget)}\n \n \n {category.percentage.toFixed(1)}%\n \n

\n ))}\n

\n )}\n\n {/* Recent Trends */}\n {data.recentTrends.length > 0 && (\n

Recent Trends

\n {data.recentTrends.map((trend, index) => (\n

\n \n {new Date(trend.month + '-01').toLocaleDateString('en-US', { \n year: 'numeric', \n month: 'long' \n })}\n \n

\n Income: {formatCurrency(trend.income)}\n

\n Expenses: {formatCurrency(trend.expenses)}\n

\n Net: {formatCurrency(trend.net)}\n

\n ))}\n

\n )}\n\n {/* Quick Actions */}\n

Quick Actions

\n \n \n \n \n

\n \n );\n}","deleted","label",[170,171,153],"frontend","components","permalink","https://www.val.town/x/beekay/support_case/code/frontend/components/Dashboard.tsx","extension","actionData","errors"]