Routes & Pages
Định nghĩa trong src/App.tsx. Tất cả route protected được bọc bởi ProtectedRoute + AppLayout (trừ payment return pages).
Public routes (không cần auth)
| Route | Component | Mục đích |
|---|---|---|
/login | LoginPage | Đăng nhập qua portal auth, hỗ trợ OTP 2FA + Turnstile |
/forgot-password | ForgotPasswordContactPage | Nhập email/phone để nhận OTP |
/forgot-password/otp | ForgotPasswordOtpPage | Xác minh OTP |
/forgot-password/reset | ForgotPasswordResetPage | Đặt mật khẩu mới |
Protected routes
| Route | Component | Mục đích |
|---|---|---|
/ | DashboardPage | Trang chủ: số dư credits/USD, số player, mua credits, quick links |
/players | PlayersPage | Danh sách player, tìm kiếm, phân trang, tạo player mới |
/players/:playerId | PlayerDetailPage | Chi tiết player: deposit/redeem, ban/unban, lịch sử |
/cashiers | CashiersPage | Quản lý cashier: danh sách, tạo mới |
/cashiers/:cashierId | CashierDetailPage | Báo cáo cashier, shifts, fraud, suspend/terminate |
/fraud-indicators | FraudIndicatorsPage | Chỉ số gian lận (tab Cashier + Player) |
/transactions | TransactionsPage | Sổ credits (ledger), filter, export CSV |
/online-transactions | OnlineBalanceTransactionsPage | Sổ USD wallet, rút crypto, export |
/provider-fees | ProviderFeesPage | Cấu hình phí provider (deposit/withdrawal/transfer) |
/withdrawals | WithdrawalsApprovalPage | Duyệt/từ chối yêu cầu rút tiền player |
/settings | SettingsPage | Cost rate, cảnh báo số dư thấp, bật 2FA |
/kiosk-domain | KioskDomainPage | Quản lý subdomain kiosk + tải poster |
/popups/send | SendPlayerPopupPage | Gửi in-app popup tới player |
/broadcasts/send | SendBroadcastPage | Gửi broadcast notification |
/payment/success | ShopPaymentSuccessPage | Callback thanh toán thành công |
/payment/cancelled | ShopPaymentCancelledPage | Callback hủy thanh toán |
/payment/error | ShopPaymentErrorPage | Callback lỗi thanh toán |
/transfer/legacy | TransferToPlayerPage | Luồng chuyển credits cũ (lookup phone + OTP) |
Redirect routes
| Route | Redirect | Ghi chú |
|---|---|---|
/transfer | → /players | Legacy |
/purchase | → / | Legacy |
* (catch-all) | → / |
Điều kiện hiển thị menu
Send popup / Send broadcast
Chỉ hiển thị khi can_delegate_popups === true (từ dashboard API hoặc user profile).
Logic trong AppLayout.tsx:
- Fetch dashboard →
setPopupNavAllowed(!!res.data.can_delegate_popups) - Fallback từ
user.can_delegate_popups
Trang /popups/send và /broadcasts/send tự redirect nếu không có quyền.
Components theo domain
Layout & Shell
| Component | File | Vai trò |
|---|---|---|
AppLayout | components/layout/AppLayout.tsx | Sidebar desktop, bottom nav mobile, balance cards, nav, account menu |
ProtectedRoute | components/auth/ProtectedRoute.tsx | Guard auth, redirect /login |
ModalPortal | components/ui/ModalPortal.tsx | Portal modal |
PortalEmptyState | components/ui/PortalEmptyState.tsx | Empty state UI |
Auth
| Component | Vai trò |
|---|---|
LoginPage | Portal login + OTP + Turnstile |
ForgotPassword*Page | 3-step password reset |
VerifyNowTrigger | Modal xác minh email/phone shop |
Business
| Component | Vai trò |
|---|---|
ShopCreditPurchaseTrigger/Modal | Mua credits (tab Crypto + Balance) |
PlayerDetailPanel | Actions trên player: deposit, redeem, ban, history |
ShopPlayerLinkByPhonePanel | Form tạo player trong modal |
ShopDashboardOverview | Card profile shop trên dashboard |
ShopNotificationBell | Bell broadcasts (poll 2 phút) |
ShopInAppPopupGate | Gate popup toàn app |
PortalWithdrawalLimitsPanel | Giới hạn rút USD |
AvailableCreditsCallout | Hiển thị số dư khi transfer/deposit |
ShopPosterDownloadSection | Tải poster quảng cáo kiosk (3 template) |
Poster templates
| Template | Style |
|---|---|
NeonArcade | Neon arcade |
GoldPremium | Gold premium |
DarkNeon | Dark neon |
Render qua html-to-image → download PNG.
Payment return flow
Backend redirect về Shop Portal sau thanh toán:
/payment/success?transaction_id=...&status=...
/payment/cancelled?transaction_id=...
/payment/error?message=...
Query params: transaction_id, status, message.