@extends('api_panel.layouts.app')

@section('title', t('apipanel-dashboard-title'))

@section('content')
    @php
        $maxRequests = max(1, collect($dailyUsage)->max('requests'));
        $totalRequests = collect($dailyUsage)->sum('requests');
        $totalCredits = collect($dailyUsage)->sum('credits');
    @endphp

    <h1 class="apipanel-h1 mb-1">{{ t('apipanel-dashboard-title') }}</h1>
    <p class="apipanel-muted mb-4">{{ $customer->name }} — {{ $customer->email }}</p>

    @if($plainKey)
        <div class="apipanel-alert apipanel-alert-key">
            <strong>{{ t('apipanel-key-plain-warning') }}</strong>
            <code class="apipanel-plainkey d-block mt-2">{{ $plainKey }}</code>
        </div>
    @endif

    {{-- ─── Durum kartları ─── --}}
    <div class="row g-3 mb-4">
        <div class="col-12 col-md-6 col-lg-3">
            <div class="apipanel-stat">
                <span class="apipanel-stat-label">{{ t('apipanel-stat-plan') }}</span>
                <span class="apipanel-stat-value">{{ $plan ? t((string) $plan->name_key) : t('apipanel-stat-no-plan') }}</span>
                @if($planSubscription && $planSubscription->ends_at)
                    <span class="apipanel-stat-sub">{{ t('apipanel-stat-plan-until') }}: {{ $planSubscription->ends_at->format('d.m.Y') }}</span>
                @endif
            </div>
        </div>
        <div class="col-12 col-md-6 col-lg-3">
            <div class="apipanel-stat">
                <span class="apipanel-stat-label">{{ t('apipanel-stat-quota') }}</span>
                <span class="apipanel-stat-value">
                    {{ $snapshot['quota_remaining'] === null ? t('apipanel-stat-unlimited') : number_format((int) $snapshot['quota_remaining']) }}
                </span>
            </div>
        </div>
        <div class="col-12 col-md-6 col-lg-3">
            <div class="apipanel-stat">
                <span class="apipanel-stat-label">{{ t('apipanel-stat-credits') }}</span>
                <span class="apipanel-stat-value">{{ number_format((int) $snapshot['credits_remaining']) }}</span>
            </div>
        </div>
        <div class="col-12 col-md-6 col-lg-3">
            <div class="apipanel-stat">
                <span class="apipanel-stat-label">{{ t('apipanel-stat-requests') }} ({{ $usageDays }}g)</span>
                <span class="apipanel-stat-value">{{ number_format($totalRequests) }}</span>
                <span class="apipanel-stat-sub">{{ number_format($totalCredits) }} {{ t('apipanel-credit-unit') }}</span>
            </div>
        </div>
    </div>

    {{-- ─── API anahtarları ─── --}}
    <div class="apipanel-card mb-4">
        <div class="d-flex flex-wrap justify-content-between align-items-center gap-2 mb-3">
            <h2 class="apipanel-h2 mb-0">{{ t('apipanel-keys-title') }}</h2>
            <span class="apipanel-muted">{{ t('apipanel-keys-hint') }}</span>
        </div>

        <form method="POST" action="{{ route('apipanel.keys.store') }}" class="row g-2 align-items-end mb-4">
            @csrf
            <div class="col-12 col-md-6">
                <label class="apipanel-label" for="key_name">{{ t('apipanel-keys-name') }}</label>
                <input type="text" id="key_name" name="name" required maxlength="100" class="apipanel-input"
                       placeholder="production-backend">
            </div>
            <div class="col-8 col-md-3">
                <label class="apipanel-label" for="key_env">{{ t('apipanel-keys-env') }}</label>
                <select id="key_env" name="environment" class="apipanel-input">
                    <option value="live">live</option>
                    <option value="test">test</option>
                </select>
            </div>
            <div class="col-4 col-md-3">
                <button type="submit" class="apipanel-btn apipanel-btn-primary w-100">{{ t('apipanel-keys-create') }}</button>
            </div>
        </form>

        @if($keys->isEmpty())
            <p class="apipanel-muted mb-0">{{ t('apipanel-keys-empty') }}</p>
        @else
            <div class="table-responsive">
                <table class="apipanel-table">
                    <thead>
                    <tr>
                        <th>{{ t('apipanel-keys-name') }}</th>
                        <th>{{ t('apipanel-keys-prefix') }}</th>
                        <th>{{ t('apipanel-keys-env') }}</th>
                        <th>{{ t('apipanel-keys-status') }}</th>
                        <th>{{ t('apipanel-keys-last-used') }}</th>
                        <th></th>
                    </tr>
                    </thead>
                    <tbody>
                    @foreach($keys as $key)
                        <tr>
                            <td>{{ $key->name }}</td>
                            <td><code>{{ $key->key_prefix }}…</code></td>
                            <td>{{ $key->environment }}</td>
                            <td>
                                <span class="apipanel-badge {{ $key->isActive() ? 'is-active' : 'is-muted' }}">
                                    {{ $key->isActive() ? t('apipanel-keys-status-active') : t('apipanel-keys-status-revoked') }}
                                </span>
                            </td>
                            <td>{{ $key->last_used_at ? $key->last_used_at->format('d.m.Y H:i') : '—' }}</td>
                            <td class="text-end">
                                @if($key->isActive())
                                    <form method="POST" action="{{ route('apipanel.keys.revoke', $key->id) }}" class="m-0">
                                        @csrf
                                        <button type="submit" class="apipanel-btn apipanel-btn-danger btn-sm">
                                            {{ t('apipanel-keys-revoke') }}
                                        </button>
                                    </form>
                                @endif
                            </td>
                        </tr>
                    @endforeach
                    </tbody>
                </table>
            </div>
        @endif
    </div>

    {{-- ─── Kullanım grafiği ─── --}}
    <div class="apipanel-card mb-4">
        <h2 class="apipanel-h2">{{ t('apipanel-usage-title') }}</h2>
        <p class="apipanel-muted">{{ t('apipanel-usage-subtitle') }}</p>

        <div class="apipanel-chart" role="img" aria-label="{{ t('apipanel-usage-title') }}">
            @foreach($dailyUsage as $day)
                <div class="apipanel-chart-col" title="{{ $day['date'] }}: {{ $day['requests'] }}">
                    <div class="apipanel-chart-bar" style="height: {{ max(2, (int) round($day['requests'] / $maxRequests * 100)) }}%"></div>
                    <span class="apipanel-chart-label">{{ $day['label'] }}</span>
                </div>
            @endforeach
        </div>
    </div>

    <div class="row g-3">
        {{-- ─── SKU kırılımı ─── --}}
        <div class="col-12 col-lg-6">
            <div class="apipanel-card h-100">
                <h2 class="apipanel-h2">{{ t('apipanel-usage-sku-title') }}</h2>

                @if(empty($skuUsage))
                    <p class="apipanel-muted mb-0">{{ t('apipanel-usage-empty') }}</p>
                @else
                    <div class="table-responsive">
                        <table class="apipanel-table">
                            <thead>
                            <tr>
                                <th>{{ t('apipanel-usage-sku') }}</th>
                                <th class="text-end">{{ t('apipanel-usage-requests') }}</th>
                                <th class="text-end">{{ t('apipanel-usage-credits') }}</th>
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($skuUsage as $row)
                                <tr>
                                    <td>
                                        <span class="d-block">{{ $row['name'] }}</span>
                                        <code class="apipanel-muted">{{ $row['sku'] }}</code>
                                    </td>
                                    <td class="text-end">{{ number_format($row['requests']) }}</td>
                                    <td class="text-end">{{ number_format($row['credits']) }}</td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                @endif
            </div>
        </div>

        {{-- ─── Kredi hareketleri + SKU bakiyeleri ─── --}}
        <div class="col-12 col-lg-6">
            <div class="apipanel-card h-100">
                <h2 class="apipanel-h2">{{ t('apipanel-credits-title') }}</h2>

                @if(!empty($snapshot['sku_balances']))
                    <div class="apipanel-chips mb-3">
                        @foreach($snapshot['sku_balances'] as $sku => $remaining)
                            <span class="apipanel-chip">{{ $sku }}: <strong>{{ number_format((int) $remaining) }}</strong></span>
                        @endforeach
                    </div>
                @endif

                @foreach($endpointSubscriptions as $subscription)
                    <div class="apipanel-subline">
                        <code>{{ $subscription->sku }}</code>
                        <span>{{ number_format((int) $subscription->monthly_request_quota) }} {{ t('apipanel-usage-requests') }}/{{ t('apipanel-month') }}</span>
                        @if($subscription->ends_at)
                            <span class="apipanel-muted">{{ $subscription->ends_at->format('d.m.Y') }}</span>
                        @endif
                    </div>
                @endforeach

                @if($creditTransactions->isEmpty())
                    <p class="apipanel-muted mb-0">{{ t('apipanel-credits-empty') }}</p>
                @else
                    <div class="table-responsive">
                        <table class="apipanel-table">
                            <thead>
                            <tr>
                                <th>{{ t('apipanel-credits-date') }}</th>
                                <th>{{ t('apipanel-credits-type') }}</th>
                                <th class="text-end">{{ t('apipanel-credits-amount') }}</th>
                                <th class="text-end">{{ t('apipanel-credits-balance') }}</th>
                            </tr>
                            </thead>
                            <tbody>
                            @foreach($creditTransactions as $transaction)
                                <tr>
                                    <td>{{ $transaction->created_at?->format('d.m.Y H:i') }}</td>
                                    <td>{{ $transaction->type }}</td>
                                    <td class="text-end {{ $transaction->amount < 0 ? 'apipanel-negative' : 'apipanel-positive' }}">
                                        {{ $transaction->amount > 0 ? '+' : '' }}{{ number_format((int) $transaction->amount) }}
                                    </td>
                                    <td class="text-end">{{ number_format((int) $transaction->balance_after) }}</td>
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                @endif
            </div>
        </div>
    </div>
@endsection