mirror of
https://github.com/NoFxAiOS/nofx.git
synced 2026-07-04 11:30:58 +08:00
b690debf5e
* refactor(web): restructure AITradersPage into modular architecture Refactored the massive 2652-line AITradersPage.tsx into a clean, modular architecture following React best practices. **Changes:** - Decomposed 2652-line component into 12 focused modules - Introduced Zustand stores for config and modal state management - Extracted all business logic into useTraderActions custom hook (633 lines) - Created reusable section components (PageHeader, TradersGrid, etc.) - Separated complex modal logic into dedicated components - Added TraderConfig type, eliminated all any types - Fixed critical bugs in configuredExchanges logic and getState() usage **File Structure:** - Main page reduced from 2652 → 234 lines (91% reduction) - components/traders/: 7 UI components + 5 section components - stores/: tradersConfigStore, tradersModalStore - hooks/: useTraderActions (all business logic) 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: tinkle-community <tinklefund@gmail.com> * chore: ignore PR_DESCRIPTION.md * fix(web): restore trader dashboard navigation functionality Fixed missing navigation logic in refactored AITradersPage. The "查看" (View) button now correctly navigates to the trader dashboard. **Root Cause:** During refactoring, the `useNavigate` hook and default navigation logic were inadvertently omitted from the main page component. **Changes:** - Added `useNavigate` import from react-router-dom - Implemented `handleTraderSelect` function with fallback navigation - Restored original behavior: use `onTraderSelect` prop if provided, otherwise navigate to `/dashboard?trader=${traderId}` **Testing:** - ✅ Click "查看" button navigates to trader dashboard - ✅ Query parameter correctly passed to dashboard 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: tinkle-community <tinklefund@gmail.com> * fix(web): correct type definitions for trader configuration Fixed TypeScript build errors by using the correct `TraderConfigData` type instead of the incorrect `TraderConfig` type. **Root Cause:** During refactoring, a new `TraderConfig` type was incorrectly created that extended `CreateTraderRequest` (with fields like `name`, `ai_model_id`). However, the `TraderConfigModal` component and API responses actually use `TraderConfigData` (with fields like `trader_name`, `ai_model`). **Changes:** - Replaced all `TraderConfig` references with `TraderConfigData`: - stores/tradersModalStore.ts - hooks/useTraderActions.ts - lib/api.ts - Removed incorrect `TraderConfig` type definition from types.ts - Added null check for `editingTrader.trader_id` to satisfy TypeScript **Build Status:** - ✅ TypeScript compilation: PASS - ✅ Vite production build: PASS 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: tinkle-community <tinklefund@gmail.com> --------- Co-authored-by: tinkle-community <tinklefund@gmail.com>
55 lines
1.7 KiB
TypeScript
55 lines
1.7 KiB
TypeScript
import { AlertTriangle } from 'lucide-react'
|
||
import { t, type Language } from '../../../i18n/translations'
|
||
|
||
interface SignalSourceWarningProps {
|
||
language: Language
|
||
onConfigure: () => void
|
||
}
|
||
|
||
export function SignalSourceWarning({
|
||
language,
|
||
onConfigure,
|
||
}: SignalSourceWarningProps) {
|
||
return (
|
||
<div
|
||
className="rounded-lg px-4 py-3 flex items-start gap-3 animate-slide-in"
|
||
style={{
|
||
background: 'rgba(246, 70, 93, 0.1)',
|
||
border: '1px solid rgba(246, 70, 93, 0.3)',
|
||
}}
|
||
>
|
||
<AlertTriangle
|
||
size={20}
|
||
className="flex-shrink-0 mt-0.5"
|
||
style={{ color: '#F6465D' }}
|
||
/>
|
||
<div className="flex-1">
|
||
<div className="font-semibold mb-1" style={{ color: '#F6465D' }}>
|
||
⚠️ {t('signalSourceNotConfigured', language)}
|
||
</div>
|
||
<div className="text-sm" style={{ color: '#848E9C' }}>
|
||
<p className="mb-2">{t('signalSourceWarningMessage', language)}</p>
|
||
<p>
|
||
<strong>{t('solutions', language)}</strong>
|
||
</p>
|
||
<ul className="list-disc list-inside space-y-1 ml-2 mt-1">
|
||
<li>点击"{t('signalSource', language)}"按钮配置API地址</li>
|
||
<li>或在交易员配置中禁用"使用币种池"和"使用OI Top"</li>
|
||
<li>或在交易员配置中设置自定义币种列表</li>
|
||
</ul>
|
||
</div>
|
||
<button
|
||
onClick={onConfigure}
|
||
className="mt-3 px-3 py-1.5 rounded text-sm font-semibold transition-all hover:scale-105"
|
||
style={{
|
||
background: '#F0B90B',
|
||
color: '#000',
|
||
}}
|
||
>
|
||
{t('configureSignalSourceNow', language)}
|
||
</button>
|
||
</div>
|
||
</div>
|
||
)
|
||
}
|