@extends('layouts.front')

@section('content')
@php
    $totalRechargeAmount = (float) $wallethistory->sum('addamount');
    $transactionProofCount = $wallethistory->filter(fn ($entry) => filled($entry->transectionid))->count();
    $latestRecharge = $wallethistory->first();
@endphp
<div class="jel-portal-page">
    <section class="jel-history-layout">
        <div class="jel-history-intro">
            <span class="jel-portal-kicker">Wallet Records</span>
            <h1>Your wallet recharge history.</h1>
            <p>Added, pending ya cancelled wallet transactions ko yahan date aur transaction ID ke sath track kar sakte hain.</p>

            <div class="jel-result-summary-grid jel-history-summary-grid">
                <article>
                    <span>Total Transactions</span>
                    <strong>{{ $wallethistory->count() }}</strong>
                </article>
                <article>
                    <span>Total Recharge Value</span>
                    <strong>&#8377;{{ number_format($totalRechargeAmount, 2) }}</strong>
                </article>
                <article>
                    <span>Transaction IDs Shared</span>
                    <strong>{{ $transactionProofCount }}</strong>
                </article>
                <article>
                    <span>Latest Status</span>
                    <strong>{{ $latestRecharge->status_label ?? 'No record' }}</strong>
                </article>
            </div>

            <div class="jel-inline-actions">
                <a class="jel-portal-button jel-portal-button-muted" href="{{ route('walletrecharge') }}">Add Wallet Balance</a>
                <a class="jel-portal-button jel-portal-button-secondary" href="{{ route('userwithdraw') }}">Withdraw Rewards</a>
            </div>
        </div>

        @include('front.partials.history-tabs')
    </section>

    <section class="jel-history-card">
        <div class="jel-history-card-head">
            <div>
                <span class="jel-portal-kicker">Wallet History</span>
                <h2>Recharge Details</h2>
            </div>
            <span class="jel-history-count">{{ $wallethistory->count() }} Transactions</span>
        </div>

        <div class="jel-history-list">
            @forelse ($wallethistory as $gameplayhistorydata)
                <article class="jel-history-item">
                    <div class="jel-history-item-main">
                        <div class="jel-history-line">
                            <h3>{{ $gameplayhistorydata->status_label }}</h3>
                            <span class="jel-status-badge jel-status-secondary">Wallet</span>
                        </div>
                        <p>Transaction ID: <strong>{{ $gameplayhistorydata->transectionid ?: 'Not available' }}</strong></p>
                    </div>
                    <div class="jel-history-item-side">
                        <strong>&#8377;{{ number_format((float) $gameplayhistorydata->addamount, 2) }}</strong>
                        <span>{{ optional($gameplayhistorydata->createdtime)->format('d M Y, h:i A') }}</span>
                    </div>
                </article>
            @empty
                <div class="jel-empty-state">
                    <h3>No wallet history found yet.</h3>
                    <p>Recharge karne ke baad wallet transaction entries yahan dikhengi.</p>
                </div>
            @endforelse
        </div>
    </section>
</div>
@endsection
