feat(ui): dashboard — TrendPanel and RollingAverages components

[Tinna23]

Overview

Build TrendPanel and RollingAverages — the analytical components of the dashboard that give users a sense of fee direction and short/medium/long-term averages.

Acceptance Criteria

TrendPanel

• Component at src/app/components/dashboard/TrendPanel.tsx
• Accepts props: { history: FeeStats[]; isLoading: boolean }
• Displays current trend direction: ↑ RISING, ↓ FALLING, or → STABLE
• Trend derived by comparing the most recent avg fee to a rolling window mean
• Trend indicator colour: red for rising, green for falling, yellow for stable

RollingAverages

• Component at src/app/components/dashboard/RollingAverages.tsx
• Accepts props: { history: FeeStats[]; isLoading: boolean }
• Displays three rolling averages computed from the history data:
  • Short (last 10 data points) — avg fee + % change vs previous short window
  • Medium (last 30 data points) — avg fee + % change
  • Long (last 60 data points) — avg fee + % change
• Percentage change coloured: green if improving (fees down), red if worsening (fees up)
• Loading state: skeleton rows

Notes

• Both components receive history data from DashboardShell — they do not fetch independently
• Rolling window sizes are based on available data points; gracefully handle cases where history is shorter than the window