Dashboard Documentation

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

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

Card Types

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

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

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

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:

$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,
];

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:

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

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

Widget Components

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

Primary Data Sources

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

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

Main Dashboard Endpoint

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

Response Structure

{
  "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