Frontend Dashboard
Comprehensive guide to the user dashboard features, portfolio overview, watchlist, price alerts, and market data widgets.
Dashboard Overview
The CoinTrail frontend dashboard provides users with a personalized view of the cryptocurrency market. Logged-in users see their portfolio, watchlist, and active alerts at a glance, while the public homepage displays global market statistics.
The user dashboard provides a comprehensive view of portfolio, watchlist, and market data
The personalized dashboard features (portfolio, watchlist, alerts) require users to be logged in. Guest users see the public market overview.
Dashboard Layout
The user dashboard is organized into several key sections:
| Section | Description | Subscription Required |
|---|---|---|
| Portfolio Summary | Total holdings value with 24h change | Premium+ |
| Watchlist Quick View | Top 5 watched coins with prices | Free |
| Active Price Alerts | Pending alerts with trigger prices | Free (limited) |
| Market Overview | Global stats, trending coins | Free |
| Recent Activity | Login history, recent actions | Free |
Portfolio Overview Widget
The portfolio widget displays a summary of the user's cryptocurrency holdings with real-time valuation.
The portfolio widget provides a quick summary of your cryptocurrency holdings and performance
Portfolio Features
- Total Value - Sum of all holdings in selected fiat currency
- 24h Change - Portfolio value change in the last 24 hours
- 7d Change - Weekly portfolio performance
- Asset Allocation - Pie chart showing distribution
- Top Holdings - Largest positions by value
Users can add transactions manually or connect exchange APIs (Pro plan) for automatic portfolio syncing.
Portfolio Data Display
| Data Point | Description | Update Frequency |
|---|---|---|
| Current Value | Holdings multiplied by current prices | Real-time |
| Cost Basis | Total amount invested | On transaction |
| Profit/Loss | Current value minus cost basis | Real-time |
| ROI Percentage | Return on investment calculation | Real-time |
Watchlist Widget
The watchlist widget shows cryptocurrencies the user has marked for monitoring. It provides quick access to price information without navigating away from the dashboard.
Watchlist Features
Quick Add/Remove
Star icon on any coin page to instantly add or remove from watchlist.
Price Sparklines
Mini 7-day price charts for each watched coin.
Real-time Updates
Prices update automatically without page refresh.
Custom Sorting
Drag and drop to reorder or sort by price, change, or name.
Watchlist Limits by Plan
| Plan | Watchlist Limit | Features |
|---|---|---|
| Free | 10 coins | Basic price tracking |
| Premium | 50 coins | Price tracking + sparklines |
| Pro | Unlimited | All features + multiple watchlists |
Price Alerts Widget
The price alerts widget displays active alerts and allows users to quickly create new ones. Alerts notify users when a cryptocurrency reaches a specified price target.
Set and manage price alerts to stay informed about important price movements
Alert Configuration
Select Cryptocurrency
Choose from the list of available cryptocurrencies. You can search by name or symbol.
Set Target Price
Enter the price at which you want to be notified. Select whether to trigger when price goes above or below this target.
Choose Notification Method
Select how you want to be notified: email, browser push notification, or both.
Set Recurrence (Optional)
Choose whether the alert triggers once or repeatedly (Premium+ feature).
Alert Types
| Alert Type | Description | Example |
|---|---|---|
| Price Above | Triggers when price exceeds target | BTC > $50,000 |
| Price Below | Triggers when price drops below target | ETH < $2,000 |
| Percentage Change | Triggers on % change in timeframe | SOL +10% in 24h |
| Volume Spike | Triggers on unusual trading volume | DOGE volume 3x average |
Price alerts are checked every minute via cron job. Ensure your cron jobs are configured correctly for alerts to work.
Market Overview
The market overview section displays global cryptocurrency statistics and trending data visible to all users.
Global market statistics provide real-time insight into overall cryptocurrency market health
Global Statistics
- Total Market Cap - Combined value of all cryptocurrencies
- 24h Trading Volume - Total trading activity across exchanges
- BTC Dominance - Bitcoin's share of total market cap
- ETH Dominance - Ethereum's share of total market cap
- Active Cryptocurrencies - Number of tracked coins
- Fear & Greed Index - Market sentiment indicator (0-100)
Trending Sections
Trending sections help users discover popular and actively traded cryptocurrencies
| Section | Description | Data Source |
|---|---|---|
| Trending Coins | Top 7 coins by search popularity | CoinGecko API |
| Top Gainers | Biggest price increases (24h) | Price data |
| Top Losers | Biggest price decreases (24h) | Price data |
| Most Traded | Highest 24h trading volume | Volume data |
| Recently Added | Newly listed cryptocurrencies | Database |
Dashboard Customization
Users can personalize their dashboard experience with various display options.
Display Settings
- Currency Selection - Display prices in USD, EUR, GBP, and 30+ other fiat currencies
- Theme Mode - Toggle between light and dark mode
- Language - Select from available interface languages
- Widget Visibility - Show/hide specific dashboard sections
Widget Arrangement
Premium and Pro users can customize their dashboard layout:
User Menu → Settings → Dashboard Preferences
Options:
- Reorder widgets via drag and drop
- Resize widgets (compact/expanded)
- Hide unused widgets
- Set default landing sectionEncourage users to set up their watchlist and price alerts during onboarding for a better dashboard experience.