@extends('layouts.admin')

@section('title', 'Referral Activity')

@section('content')
    <div class="admin-dashboard-head mb-2">
        <div>
            <span class="loot-pill mb-1"><i data-feather="share-2"></i>Referral command center</span>
            <h1 class="mb-1">Referral Activity</h1>
            <p class="loot-muted mb-0">Track referred signups, lifetime commissions, and top referral partners.</p>
        </div>
        <form method="GET" class="d-flex gap-1">
            <select name="type" class="form-select">
                <option value="">All events</option>
                <option value="signup_bonus" @selected(request('type') === 'signup_bonus')>Signup bonus</option>
                <option value="commission" @selected(request('type') === 'commission')>Commission</option>
            </select>
            <button class="btn btn-loot">Filter</button>
        </form>
    </div>

    <div class="admin-kpi-strip mb-2">
        <div class="admin-kpi-card admin-kpi-primary"><span>Referral rewards</span><strong>{{ format_coins_as_usd($stats['referral_earnings']) }}</strong><p>{{ number_format($stats['referral_earnings']) }} coins credited through referrals.</p></div>
        <div class="admin-kpi-card"><span>Referrers</span><strong>{{ number_format($stats['referrers']) }}</strong><p>Users with referred members.</p></div>
        <div class="admin-kpi-card"><span>Referred users</span><strong>{{ number_format($stats['referred_users']) }}</strong><p>Accounts joined by referral.</p></div>
        <div class="admin-kpi-card"><span>Commissions</span><strong>{{ number_format($stats['commissions']) }}</strong><p>Earn events with 5% reward.</p></div>
    </div>

    <div class="row">
        <div class="col-xl-4 mb-2">
            <div class="user-page-card h-100">
                <h3 class="loot-section-title mb-2">Top referrers</h3>
                @forelse($topReferrers as $referrer)
                    <div class="loot-activity-row">
                        <div class="d-flex align-items-center gap-1 min-w-0">
                            <img class="rounded-circle" src="{{ $referrer->avatar() }}" alt="{{ $referrer->username }}" width="38" height="38">
                            <div class="min-w-0">
                                <strong>{{ $referrer->username }}</strong>
                                <span>{{ number_format($referrer->referred_users_count) }} users referred</span>
                            </div>
                        </div>
                        <span class="loot-status success">{{ format_coins_as_usd($referrer->referral_earnings) }} <small>· {{ number_format($referrer->referral_earnings) }} coins</small></span>
                    </div>
                @empty
                    <p class="loot-muted mb-0">No referrals tracked yet.</p>
                @endforelse
            </div>
        </div>
        <div class="col-xl-8 mb-2">
            <div class="user-page-card">
                <h3 class="loot-section-title mb-2">Referral events</h3>
                <div class="table-responsive">
                    <table class="table loot-profile-table mb-0">
                        <thead><tr><th>Type</th><th>Referrer</th><th>Referred user</th><th>Source</th><th>Reward</th><th>Date</th></tr></thead>
                        <tbody>
                        @forelse($events as $event)
                            <tr>
                                <td><span class="loot-status {{ $event->type === 'commission' ? 'success' : 'warning' }}">{{ Str::headline($event->type) }}</span></td>
                                <td>{{ $event->referrer?->username ?? 'Deleted user' }}</td>
                                <td>{{ $event->referredUser?->username ?? 'Unknown user' }}</td>
                                <td><strong>{{ format_coins_as_usd($event->source_points) }}</strong><small class="d-block loot-muted">{{ number_format($event->source_points) }} coins</small></td>
                                <td><strong>{{ format_coins_as_usd($event->reward_points) }}</strong><small class="d-block loot-muted">{{ number_format($event->reward_points) }} coins</small></td>
                                <td>{{ $event->created_at->format('M d, Y H:i') }}</td>
                            </tr>
                        @empty
                            <tr><td colspan="6" class="text-center py-4 loot-muted">No referral events found.</td></tr>
                        @endforelse
                        </tbody>
                    </table>
                </div>
                <div class="mt-2">{{ $events->links() }}</div>
            </div>
        </div>
    </div>
@endsection
