+ {/* Header Section */}
+
+
+ {/* Agent Icon */}
+
+ {getAgentIcon(bot.name)}
+
+
+ {/* Agent Name and Risk Level */}
+
+
{bot.displayName}
+ {riskBadge.label}
+
+
+
+ {/* Status Badge */}
+
+ {bot.status.charAt(0).toUpperCase() + bot.status.slice(1)}
+
+
+
+ {/* Description */}
+ {bot.description && (
+
{bot.description}
+ )}
+
+ {/* Main Metrics Grid */}
+
+ {/* P&L Card */}
+
+
Today's P&L
+
+ {isProfitable ? (
+
+ ) : (
+
+ )}
+
+ {formatCurrency(bot.todayPnl)}
+
+
+
+
+ {/* Win Rate Card */}
+
+
Win Rate
+
{formatPercentage(winRate)}
+
+
+
+ {/* Secondary Stats */}
+
+ {/* Positions */}
+
+
Positions
+
{bot.positions}
+
+
+ {/* Equity */}
+
+
Equity
+
{formatCurrency(bot.equity)}
+
+
+ {/* Total Trades */}
+
+
Trades
+
{bot.metrics?.total_trades ?? 0}
+
+
+
+ {/* Action Buttons */}
+
+ {/* View Details Button */}
+ {onSelect && (
+
+ )}
+
+ {/* Start/Stop Button */}
+ {bot.status === 'running' || bot.status === 'paused' ? (
+ onStop && (
+
+ )
+ ) : (
+ onStart && (
+
+ )
+ )}
+
+ {/* Pause Button (only when running) */}
+ {bot.status === 'running' && onStop && (
+
+ )}
+
+
+ );
+};
+
+export default BotCard;
diff --git a/src/modules/trading/components/agents/index.ts b/src/modules/trading/components/agents/index.ts
new file mode 100644
index 0000000..4f526d7
--- /dev/null
+++ b/src/modules/trading/components/agents/index.ts
@@ -0,0 +1,7 @@
+/**
+ * Export all agent-related components
+ */
+
+export { AgentsList } from './AgentsList';
+export { AgentCard } from './AgentCard';
+export { BotCard } from './BotCard';
diff --git a/src/modules/trading/components/index.ts b/src/modules/trading/components/index.ts
index f426fa0..38e7642 100644
--- a/src/modules/trading/components/index.ts
+++ b/src/modules/trading/components/index.ts
@@ -66,3 +66,7 @@ export { default as PositionModifierDialog } from './PositionModifierDialog';
export { default as RiskBasedPositionSizer } from './RiskBasedPositionSizer';
export { default as TradeAlertsNotificationCenter } from './TradeAlertsNotificationCenter';
export type { TradeAlert, AlertType, AlertPriority } from './TradeAlertsNotificationCenter';
+
+// Trading Agents Components (OQI-007)
+export { AgentsList } from './agents/AgentsList';
+export { BotCard } from './agents/BotCard';
diff --git a/src/modules/trading/pages/AgentsPage.tsx b/src/modules/trading/pages/AgentsPage.tsx
new file mode 100644
index 0000000..de19660
--- /dev/null
+++ b/src/modules/trading/pages/AgentsPage.tsx
@@ -0,0 +1,23 @@
+/**
+ * Trading Agents Page
+ * Manage and monitor trading agents within the trading module
+ */
+
+import { AgentsList } from '../components/agents/AgentsList';
+
+export default function AgentsPage() {
+ return (
+