Management Backend

admin-next User Detail Modal - UserDetailModal Dual-Column Layout + Tab Partition + Device Management and Account Freezing

admin-next UI Component Library — 12 Base Components: Button, Card, Modal, Input, Select, Switch, Badge, Toast, Dropdown, ImageUpload, Breadcrumbs

A comprehensive walkthrough of the admin-next UI component library — 12 reusable components built with React, Tailwind CSS, and Framer Motion. Covers Button, Card, Modal, Input, Select, Switch, Badge, Toast, Dropdown, ImageUpload, Breadcrumbs, and utility exports.

admin-next Server Prefetch + ISR — Server Component Data Fetching and Incremental Static Regeneration

A deep dive into admin-next's server-side data fetching strategy — the serverGet utility for Server Components, ISR revalidation with tags, and Server Actions for cache invalidation.

Security Toolchain: Zod Validation + PII Masking + XSS Protection

The `security-utils.ts` module is the frontend security toolkit for the admin panel, covering five security concerns in 276 lines: Zod input validation, PII data masking, XSS protection, SQL injection heuristic detection, and password strength evaluation.

admin-next Route Configuration System — 8 Route Groups, 27 Routes, and lucide-react Icon Mapping

A deep dive into the admin-next route configuration system — the RouteConfig type system, 8 route groups with 27 route definitions, lucide-react icon mapping strategy, hidden routes for metadata matching, and navigation/authorization integration.

Registration Application Approval Workflow — Full Chain from Admin Account Self-Service Application to Permission Activation

admin-next Product CRUD——CreateProductFormModal + EditProductFormModal: react-hook-form Multi-Section Form with Image Upload

Prisma Database Schema Design: Layered Architecture and Best Practices for 30+ Models

Deep Dive into Payment Webhook & Callback Handling — Optimistic Locking, Idempotency, Atomic Wallet Operations

In-depth analysis of PaymentWebhookController (single endpoint routing + callback-token authentication) → handleUniversalWebhook (deposit/withdrawal routing) → handleInvoiceWebhook (updateMany optimistic locking + creditCash) → handlePayoutWebhook (atomic unfreeze + CRITICAL degradation) → WalletService (ensureWallet / creditCash / freezeCash / unfreezeCash + beforeBalance/afterBalance audit trail)

Full Payment Process Chain — API Xendit → Flutter App → admin-next Financial Audit

NestJS PaymentService (Xendit Invoice/Payout Gateway) → ClientWalletService (Deposit/Withdrawal/Webhook Callback Business Logic) → admin-next Finance Page (WithdrawalList, DepositList, TransactionList)