Dashboard module & routing
modules/dashboard/ · pages/dashboard/ · routes/pagePaths.ts
Page composition pattern
Every authenticated route follows: layout wrapper → module page → presentational components. pages/** files are thin — they import a *UI component from modules/dashboard/pages/** and either wrap it in layout/DashboardWrapper or a capability guard (SessionCapabilityPageShell / CapabilityGuard), or the module component wraps itself. Each feature folder under modules/dashboard/pages/ pairs a <Feature>UI.tsx with a use<Feature>.tsx hook that owns data-fetching (via api/hooks/dashboard/*) and local state.
For the exhaustive per-page action list (every button/filter/mutation), see Page & Action Catalog.
Route table
| Route | Renders | Guard |
|---|---|---|
/dashboard | DashboardUI — home KPI overview | SessionCapabilityPageShell |
/dashboard/traders | tradersUI — traders list | DashboardWrapper |
/dashboard/trader_details | tradersdetailsUI | DashboardWrapper |
/dashboard/customers | customersUI | DashboardWrapper |
/dashboard/customer_details, /customers/[customer_id] | CustomerDetailsUI | DashboardWrapper |
/dashboard/orders | ordersUI | DashboardWrapper |
/dashboard/order_details | ordersdetailsUI | DashboardWrapper |
/dashboard/commerce/products | productsUI | DashboardWrapper |
/dashboard/trader-payout/all · /pending · /active-payouts | traderPayoutAll / Pending / DayOne UI — the 13-stage payout review pipeline | self-wrapped |
/dashboard/payout-operations | PayoutOperationsUI — 3-status operator view with live Rise verification | self-wrapped |
/dashboard/sim_funded_traders, /dashboard/payout | SIMFundedTradersUI | DashboardWrapper |
/dashboard/payout_details | PayoutDetailsUI (legacy) | DashboardWrapper |
/dashboard/reports/exposure · /details | ExposureUI / ExposureDetailsUI | self-wrapped |
/dashboard/reports/hedging · /details | HedgingUI / HedgingDetailsUI | self-wrapped |
/dashboard/reports/idle-report | IdleTimeUI | self-wrapped |
/dashboard/reports/tos-breach | TOSBreachUI | self-wrapped |
/dashboard/reports/security-flags/tos|ip-checks|idle-check|copy-trading | SecurityFlagsUI (one component, category prop) | none explicit |
/dashboard/reports/security-flags/details | SecurityFlagsDetailsUI — unified flag detail + enforcement center | none explicit |
/dashboard/reports/security-flags/exceptions | SecurityExceptionsUI — governance workspace | CapabilityGuard (exceptions_view) |
/dashboard/reports/security-flags/policy-center | SecurityPolicyCenterUI | CapabilityGuard (policy_center_view) |
/dashboard/reports/security-flags/background-checks | BackgroundChecksUI | SessionCapabilityPageShell |
/dashboard/reports/security-flags/ip-logs | IPLogListUI | SessionCapabilityPageShell |
/dashboard/reports/compliance | SecurityFlagsUI (compliance mode) | SessionCapabilityPageShell |
/dashboard/reports/compliance-cases | ComplianceCasesUI | CapabilityGuard (compliance_cases_view) |
/dashboard/reports/microscalping | MicroScalpingDetailsUI | self-wrapped |
/dashboard/reports/rise-kyc | RiseKycDetailsUI | self-wrapped |
/dashboard/no-sections | NoSectionsAssignedPage | DashboardWrapper |
/settings | settingsUI | DashboardWrapper |
/ | HomeUI — public overview | self-wrapped |
Two legacy redirect shims remain: reports/idle-report/details and reports/tos-breach/details both forward to the unified reports/security-flags/details page.
modules/dashboard breakdown
Feature folders in modules/dashboard/pages/**
SecurityFlagsUI/ + SecurityFlagsDetailsUI/ — The largest feature cluster. SecurityFlagsUI is one component reused across 6 routes via category/fixedFlagType/compliance props. SecurityFlagsDetailsUI handles any flag type's detail view, with an enforcementCenter/ sub-module (action bar, audit timeline, trader notice card), IP log inspector, trade/device evidence panels, VPN/proxy detection, position-overlap timeline.
SecurityExceptionsUI/ (~25 files) — Exception-rule governance workspace: approval workflow, ownership, governance report, emergency-disable, recertification, rule intelligence, simulation, condition builder.
SecurityPolicyCenterUI/ (~15 files) — Central policy-authoring UI: rule editor, draft/version panel, routing editor, impact/validation panels, lifecycle tracker, migration panel, global audit.
ComplianceCasesUI/ & complianceShared/ — Case management queue + detail modal, audit package export; shared chrome (CompliancePageChrome, ComplianceQueueTabs) reused by both compliance-cases and the compliance-mode security-flags queue.
traderPayout/ + traderPayoutAll/, traderPayoutDayOne/, traderPayoutPending/ — Shared engine (useTraderPayout) and ~14 components (stage tabs, breach tabs, bulk action bar, flow diagram, risk report modal) for the full payout review pipeline — new_request → trading_review → security_review → pre_approved/denied → ready_to_process → awaiting_rise_kyc → sent_to_rise → processing_batch → processed/denied/failed_checks. The three page variants filter this same engine differently.
payoutOperations/ — Operator-facing simplified view collapsing the 13-stage pipeline into 3 statuses (awaiting_onboarding / ready_for_payment / paid), with live "Verify with Rise" integration.
ExposureUI/, ExposureDetailsUI/, HedgingUI/, HedgingDetailsUI/, IdleTimeUI/(+Details), TOSBreachUI/(+Details) — Risk-report list/detail pairs, sharing ExposureReportDetailsSkeleton as their loading state and exposureFilter.schema.ts (Yup) for exposure's min/max filter form.
DashboardUI/, HomeUI/, tradersUI/, tradersdetailsUI/, customersUI/, CustomerDetailsUI/, ordersUI/, ordersdetailsUI.tsx/, productsUI/, settingsUI/ — The core KPI/list/detail pages for the main business domains (trading, customers, orders, commerce, account settings).
BackgroundChecksUI/, IPLogListUI/, MicroScalpingDetailsUI/, RiseKycDetailsUI/, SIMFundedTradersUI/, PayoutDetailsUI/ — Smaller standalone report/detail pages. useBackgroundChecks.tsx also exports BackgroundChecksPoller, a headless component mounted globally by DashboardWrapper to keep task status fresh app-wide.