mirror of
https://github.com/NoFxAiOS/nofx.git
synced 2026-07-10 22:36:58 +08:00
* 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) 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 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 Co-Authored-By: tinkle-community <tinklefund@gmail.com> --------- Co-authored-by: tinkle-community <tinklefund@gmail.com>
63 lines
1.5 KiB
TypeScript
63 lines
1.5 KiB
TypeScript
import { createBrowserRouter, Navigate } from 'react-router-dom'
|
|
import MainLayout from '../layouts/MainLayout'
|
|
import AuthLayout from '../layouts/AuthLayout'
|
|
import { LandingPage } from '../pages/LandingPage'
|
|
import { FAQPage } from '../pages/FAQPage'
|
|
import { LoginPage } from '../components/LoginPage'
|
|
import { RegisterPage } from '../components/RegisterPage'
|
|
import { ResetPasswordPage } from '../components/ResetPasswordPage'
|
|
import { CompetitionPage } from '../components/CompetitionPage'
|
|
import { AITradersPage } from '../pages/AITradersPage'
|
|
import TraderDashboard from '../pages/TraderDashboard'
|
|
|
|
export const router = createBrowserRouter([
|
|
{
|
|
path: '/',
|
|
element: <LandingPage />,
|
|
},
|
|
// Auth routes - using AuthLayout
|
|
{
|
|
element: <AuthLayout />,
|
|
children: [
|
|
{
|
|
path: '/login',
|
|
element: <LoginPage />,
|
|
},
|
|
{
|
|
path: '/register',
|
|
element: <RegisterPage />,
|
|
},
|
|
{
|
|
path: '/reset-password',
|
|
element: <ResetPasswordPage />,
|
|
},
|
|
],
|
|
},
|
|
// Main app routes - using MainLayout with nested routes
|
|
{
|
|
element: <MainLayout />,
|
|
children: [
|
|
{
|
|
path: '/faq',
|
|
element: <FAQPage />,
|
|
},
|
|
{
|
|
path: '/competition',
|
|
element: <CompetitionPage />,
|
|
},
|
|
{
|
|
path: '/traders',
|
|
element: <AITradersPage />,
|
|
},
|
|
{
|
|
path: '/dashboard',
|
|
element: <TraderDashboard />,
|
|
},
|
|
],
|
|
},
|
|
{
|
|
path: '*',
|
|
element: <Navigate to="/" replace />,
|
|
},
|
|
])
|