diff --git a/src/components/dashboard/NetworkFeeForecast.tsx b/src/components/dashboard/NetworkFeeForecast.tsx new file mode 100644 index 00000000..8eb60f8c --- /dev/null +++ b/src/components/dashboard/NetworkFeeForecast.tsx @@ -0,0 +1,482 @@ +/** + * NetworkFeeForecast.tsx + * Issue #568: Network Fee Trend Analysis and Forecasting dashboard. + */ + +import React, { useMemo, useState, useCallback } from 'react' +import { + Area, + AreaChart, + CartesianGrid, + ResponsiveContainer, + Tooltip, + XAxis, + YAxis, + ReferenceLine, + Legend, +} from 'recharts' +import { + TrendingUp, + Activity, + Clock, + Target, + RefreshCw, + Sparkles, + AlertTriangle, + CheckCircle2, + Zap, +} from 'lucide-react' +import { TOOLTIP_STYLE, AXIS_TICK_STYLE } from '../../lib/chartUtils' +import { + analyzeNetworkFees, + generateSyntheticFeeHistory, + type FeeOptimizationRecommendation, + type NetworkFeeAnalysisResult, +} from '../../lib/networkFeeForecasting' + +function StatCard({ + label, + value, + sub, + color, + icon, +}: { + label: string + value: string + sub?: string + color: string + icon: React.ReactNode +}) { + return ( +
+ {rec.detail} +
++ Time-series fee trends, seasonal patterns, 24-hour forecasts, and actionable timing strategies for Stellar + transactions. +
+