Files
xau-ai-trading-bot/web-dashboard/src/components/dashboard/settings-card.tsx
T
buckybonezandClaude Opus 4.6 d93d790428 feat: add 5 dashboard features — dark mode, trade history, backtests, model insights, alerts
- Dark mode: class-based theme toggle with localStorage persistence and flash prevention
- Trade History (/trades): paginated table, stats cards, equity curve chart with DB API endpoints
- Backtest Viewer (/backtests): log parser for 35 backtest results, sidebar + detail + comparison tabs
- Model Insights: dashboard card + dialog showing feature importance, regime distribution, training history
- Alert/Signal Log (/alerts): signal stats, filterable table with execution tracking
- API: 8 new endpoints with psycopg2 DB connection pool
- Dark mode sweep across books page, about dialog, and all dashboard components
- Architecture docs rewritten with Mermaid diagrams (23 docs)
- README and FEATURES.md rewritten bilingual (Indonesian + English)
- main_live.py: write model_metrics.json on startup and retrain

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-09 05:46:54 +07:00

48 lines
2.0 KiB
TypeScript

"use client";
import { Card, CardContent, CardHeader, CardTitle } from "@/components/ui/card";
import { Settings2 } from "lucide-react";
import type { BotSettings } from "@/types/trading";
interface SettingsCardProps {
settings: BotSettings;
}
export function SettingsCard({ settings }: SettingsCardProps) {
const rows: { label: string; value: string }[] = [
{ label: "Mode", value: settings.capitalMode.toUpperCase() },
{ label: "Capital", value: `$${settings.capital.toLocaleString()}` },
{ label: "TF", value: `${settings.executionTF}/${settings.trendTF}` },
{ label: "Risk", value: `${settings.riskPerTrade}%` },
{ label: "Max Loss", value: `${settings.maxDailyLoss}%` },
{ label: "Leverage", value: `1:${settings.leverage}` },
{ label: "Max Lot", value: `${settings.maxLotSize}` },
{ label: "Max Pos", value: `${settings.maxPositions}` },
{ label: "R:R", value: `1:${settings.minRR}` },
{ label: "ML Conf", value: `${(settings.mlConfidence * 100).toFixed(0)}%` },
{ label: "Cooldown", value: `${settings.cooldownSeconds}s` },
{ label: "Symbol", value: settings.symbol },
];
return (
<Card className="glass h-full overflow-hidden flex flex-col">
<CardHeader>
<CardTitle className="text-sm font-medium text-muted-foreground flex items-center gap-1.5 uppercase tracking-wider">
<Settings2 className="h-4 w-4" />
Settings
</CardTitle>
</CardHeader>
<CardContent className="flex-1 min-h-0 overflow-auto">
<div className="grid grid-cols-3 gap-x-3 gap-y-1">
{rows.map((row) => (
<div key={row.label} className="flex justify-between items-center gap-1 rounded px-1 -mx-1 row-hover">
<span className="text-sm text-muted-foreground truncate">{row.label}</span>
<span className="text-sm font-semibold font-number text-foreground shrink-0">{row.value}</span>
</div>
))}
</div>
</CardContent>
</Card>
);
}