Dashboard Documentation

Comprehensive guide to the Eska Platform Dashboard - the central hub for users to monitor their trading performance, points, and platform activities.

The Dashboard is the main landing page for authenticated users, providing a comprehensive overview of their account status, trading performance, and platform engagement. It serves as the central hub where users can quickly access key information and navigate to other platform features.

Key Features

  • Real-time Statistics - Live updates of points, earnings, and rankings
  • Interactive Widgets - Engaging components for quick actions and information
  • Progress Tracking - Visual progress indicators for streaks and leaderboard position
  • Quick Access - Direct links to all major platform features
  • Responsive Design - Optimized for desktop, tablet, and mobile devices

Welcome Banner

The welcome banner is the first element users see when they access the dashboard. It provides a personalized greeting and displays key account information at a glance.

Components

  • Personalized Greeting - "Welcome back, [User Name]! 👋"
  • Points Display - Current points balance with formatting
  • Streak Information - Current trading streak count (if active)
  • User Avatar - Clickable avatar with online indicator
  • Quick Action Button - "Browse Rewards" button for immediate access

Visual Design

  • Background Image - Hero image with gradient overlay
  • Glass Morphism - Modern card-glass styling with transparency
  • Responsive Layout - Adapts from horizontal to vertical on mobile
  • Interactive Elements - Hover effects and smooth transitions

Statistics Cards

The dashboard displays four key statistics cards in a responsive grid layout, providing users with essential metrics about their account performance.

Card Types

Total Points

Data Source: user.points_balance
Display: Formatted number with commas
Color: Green theme
Icon: Currency symbol

Earned Today

Data Source: stats.earnedToday
Calculation: Points earned in last 24 hours
Color: Blue theme
Icon: Lightning bolt

Rank

Data Source: leaderboardData.current_rank
Display: "#[rank]" format
Color: Purple theme
Icon: Achievement badge

This Month

Data Source: stats.monthlyPoints
Calculation: Points earned this calendar month
Color: Orange theme
Icon: Calendar

Animation Features

  • Number Animation - Smooth counting animation when values change
  • Hover Effects - Scale and shadow effects on hover
  • Color Coding - Each card has a distinct color theme
  • Responsive Grid - Adapts from 4 columns to 2 to 1 based on screen size

Leaderboard Progress Widget

The leaderboard progress widget shows users their current ranking and progress toward the next leaderboard position, with special highlighting for top performers.

Features

  • Current Rank Display - Shows user's current position with large, prominent number
  • Points Display - Current points with user avatar
  • Progress Bar - Visual progress toward next rank (if not #1)
  • Special #1 Treatment - Crown icon and golden styling for top rank
  • Points to Next - Shows how many points needed for next rank

Data Structure

JavaScript
leaderboardData: {
  current_rank: 15,
  current_points: 12500,
  points_to_next: 500,
  next_rank_points: 13000,
  total_users: 1250
}

Trading Streak Widget

The trading streak widget tracks and displays the user's consecutive trading days, with progressive tiers and bonus multipliers.

Streak Tiers

  • Base Streak (1 day) - Starting tier with base points
  • 5-Day Streak - 1.5x multiplier on all trades
  • 10-Day Streak - 1.75x multiplier on all trades
  • 30-Day Streak - 2.0x multiplier on all trades
  • 90-Day Streak - 2.5x multiplier on all trades

Visual Elements

  • Fire Icon - 🔥 emoji to represent the streak
  • Progress Bars - Visual progress for each tier
  • Current Multiplier - Shows active bonus multiplier
  • Recent Trades - Last 7 days of trading activity
  • Milestone Tracking - Progress toward next tier

Configuration

Streak bonuses and multipliers are dynamically configured through the RewardConfigurationService:

PHP
$streakConfigs = [
    'streak_base_points' => 25,
    'streak_5_day_bonus' => 100,
    'streak_5_day_multiplier' => 1.5,
    'streak_10_day_bonus' => 250,
    'streak_10_day_multiplier' => 1.75,
    'streak_30_day_bonus' => 1000,
    'streak_30_day_multiplier' => 2.0,
    'streak_100_day_bonus' => 5000,
    'streak_90_day_multiplier' => 2.5,
];

Recent Earnings Log

The recent earnings section displays the user's latest point-earning activities, providing transparency and motivation through visible progress.

Activity Types

  • Trade Completed - Points earned from successful trades
  • Quest Completed - Points from completed quests
  • Referral Bonus - Points from successful referrals
  • Deposit Made - Points from account deposits
  • Bonus Awarded - Special bonus points

Display Features

  • Last 3 Activities - Shows most recent earning activities
  • Point Amounts - Clear display of points earned
  • Timestamps - When each activity occurred
  • Activity Descriptions - Brief description of each activity
  • View Full Log Link - Direct link to complete earnings log

Data Source

Recent activities are fetched from the activities table:

PHP
$recentActivities = Activity::where('user_id', $user->id)
    ->orderBy('created_at', 'desc')
    ->limit(3)
    ->get();

Right Sidebar Widgets

The right sidebar contains several interactive widgets that provide quick access to platform features and additional information.

Widget Components

Next Reward Progress

Shows progress toward the next available reward redemption, helping users understand how close they are to their next reward.

Spin Wheel Widget

Displays spin wheel availability with cooldown timer. Shows when the next free spin will be available and provides quick access to the spin wheel.

Leaderboard Preview

Shows top 5 users on the leaderboard with their avatars, names, and points. Highlights the current user's position.

Featured Rewards Carousel

Rotating carousel of featured rewards from the rewards catalog, encouraging users to browse and redeem rewards.

Eska Trade Sense Game

Widget for the educational trading game, showing daily stats and providing quick access to play the game.

TradingView News

Embedded TradingView news widget providing real-time market news and updates.

Economic Calendar

TradingView economic calendar widget showing upcoming economic events and their potential market impact.

Data Structure

The dashboard integrates data from multiple database tables and services to provide a comprehensive user experience.

Primary Data Sources

Data Type Source Table/Model Purpose
User Information users Basic user data, points balance, tier information
Activities activities Recent point-earning activities and transactions
Streak Data user_streaks Trading streak information and progress
Leaderboard LeaderboardService User rankings and leaderboard calculations
Rewards reward_items Featured rewards for carousel display
Spin Cooldown user_spin_cooldowns Spin wheel availability and timing
Configuration reward_configurations Dynamic configuration values for streaks and bonuses

Key Relationships

  • User → Activities - One-to-many relationship for user activities
  • User → Streaks - One-to-one relationship for streak tracking
  • User → Tier - Many-to-one relationship for user tier classification
  • User → Referrals - One-to-many for referral tracking
  • Activities → Metadata - JSON metadata for additional activity information

API Endpoints

The dashboard is served through a single main endpoint that aggregates all necessary data for the user interface.

Main Dashboard Endpoint

HTTP
GET /dashboard
Route: dashboard
Controller: DashboardController@index
Middleware: auth

Response Structure

JSON
{
  "user": {
    "id": 123,
    "name": "John Doe",
    "email": "john@example.com",
    "avatar": "/images/avatars/user123.jpg",
    "points_balance": 12500,
    "total_points_earned": 25000,
    "tier_level": "Silver",
    "tier_id": 2,
    "streak_count": 15,
    "kyc_status": "verified",
    "is_new": false,
    "leaderboard_rank": 15
  },
  "stats": {
    "earnedToday": 250,
    "monthlyPoints": 3500,
    "rank": 15,
    "dailyChange": 12.5,
    "showSpinWheel": true
  },
  "leaderboardData": {
    "current_rank": 15,
    "current_points": 12500,
    "points_to_next": 500,
    "next_rank_points": 13000
  },
  "recentActivities": [...],
  "activeQuests": [...],
  "leaderboard": [...],
  "featuredRewards": [...],
  "spinCooldown": {...},
  "streakData": {...},
  "streakConfigs": {...},
  "gameConfig": {...}
}

Performance Considerations

  • Eager Loading - Related models are loaded efficiently to prevent N+1 queries
  • Data Aggregation - Statistics are calculated using database aggregation functions
  • Caching - Leaderboard data and configuration values are cached for performance
  • Pagination - Large datasets (like activities) are limited to recent entries