Frontend
Hero Exchange Admin (2025)
Angular 17 Admin Console with Real-time Updates
A standalone Angular 17 admin console built to manage the Hero Exchange platform. Features dashboard analytics, user balance/XP management, auction controls (finish/cancel/reindex), and Python bot configuration. Uses SignalR for real-time activity feeds and NgZone integration for proper Angular change detection.
Key Features
- •Dashboard with live stats: active auctions, registered users, bot status, recent activity
- •User management: adjust Gold balance, power, level; assign heroes; view auction history
- •Auction management: list/search, force-finish, cancel, trigger search reindex
- •Bot controls: start/stop workers, configure bid rates, mystery box intervals
- •Real-time SignalR integration with NgZone for Angular change detection
Services / Architecture
- •Angular 17 standalone components with lazy-loaded routes
- •Admin API service with token authentication and persisted config
- •SignalR service with NgZone wrapper for proper zone.js integration
- •Dashboard, Users, Auctions, and Bots management pages
Methodologies & Testing
- •Standalone components: No NgModule, fully tree-shakeable
- •Isolated Jasmine/Karma tests for services and components
- •Config normalisation to handle multiple API base URL formats
- •RxJS operators for reactive data flows and error handling
Deployment
- •Static build deployed to Vercel with custom domain (admin.hero-exchange.live)
- •Proxies to Gateway /admin/* endpoints on Railway
- •Shares SignalR notifications hub with main webapp for unified updates
Gallery
Admin dashboard showing 87 active auctions, 19 users, bot status running with 2 workers, and recent auction activity
Users management page with gold, power, level adjustments and hero assignments
Auctions management table with status, reserve prices, and finish/cancel actions
Bots management page with status, config settings (bid rate, mystery interval), and real-time activity feed
Deployment architecture: Production (Vercel Edge + Railway Gateway) and Local Development (Angular CLI Proxy) flows
Vercel deployment dashboard for Admin Console at admin.hero-exchange.live