✨ feat(ui): add Expenses card to dashboard + StatsPanel

- Add expenses to SummaryData type (total, thisMonth, byCategory)
- Add Expenses stat card to DashboardPage (orange, Receipt icon)
- Add Expenses stat card to StatsPanel sidebar
- Shows total count + this month's spending

Now dashboard shows 7 stat cards: Tasks, Notes, Events, Contacts,
Bookmarks, Habits, Expenses — complete PIM coverage.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Author: ersinkoc

packages/ui/src/components/StatsPanel.tsx

@@ -24,6 +24,7 @@ import {
   Users,
   Bookmark,
   Repeat,
+  Receipt,
   AlertCircle,
   TrendingUp,
   Cpu,
@@ -284,6 +285,19 @@ export function StatsPanel({ isCollapsed, onToggle }: StatsPanelProps) {
                     color="text-emerald-500"
                   />
                 )}
+                {summary.expenses && (
+                  <StatCard
+                    icon={Receipt}
+                    label="Expenses"
+                    value={summary.expenses.total}
+                    subValue={
+                      summary.expenses.thisMonth > 0
+                        ? `${summary.expenses.thisMonth.toFixed(0)} this month`
+                        : undefined
+                    }
+                    color="text-orange-500"
+                  />
+                )}
               </div>
             )}
 

packages/ui/src/pages/DashboardPage.tsx

@@ -7,6 +7,7 @@ import {
   FileText,
   Bookmark,
   Repeat,
+  Receipt,
   Users,
   Calendar,
   AlertTriangle,
@@ -151,6 +152,7 @@ export function DashboardPage() {
   const tasksTotal = summary?.tasks.total ?? 0;
   const completionPct = tasksTotal > 0 ? Math.round((tasksCompleted / tasksTotal) * 100) : 0;
   const habits = summary?.habits;
+  const expenses = summary?.expenses;
 
   const stats = summary
     ? [
@@ -232,6 +234,22 @@ export function DashboardPage() {
               },
             ]
           : []),
+        ...(expenses
+          ? [
+              {
+                label: 'Expenses',
+                value: expenses.total,
+                sub: expenses.thisMonth > 0
+                  ? `${expenses.thisMonth.toFixed(0)} this month`
+                  : undefined,
+                icon: Receipt,
+                color: 'text-orange-500',
+                bgColor: 'bg-orange-500/10',
+                alert: false,
+                link: '/expenses',
+              },
+            ]
+          : []),
       ]
     : [];
 

packages/ui/src/types/api.ts

@@ -44,6 +44,7 @@ export interface SummaryData {
   calendar: { total: number; today: number; upcoming: number };
   contacts: { total: number; favorites: number; upcomingBirthdays: number };
   habits?: { total: number; completedToday: number; totalToday: number; percentage: number; bestStreak: number };
+  expenses?: { total: number; thisMonth: number; byCategory: Record<string, { amount: number; count: number }> };
 }
 
 /** GET /api/v1/costs/usage */