@extends('layouts.public')

@section('title', 'Crypto payment status — Boss Of AI')

@section('content')
@php
    $states = [
        'created' => ['Waiting for payment', 'Send the exact amount shown on the invoice page. This page updates once the network confirms it.'],
        'waiting' => ['Waiting for payment', 'Send the exact amount shown on the invoice page. This page updates once the network confirms it.'],
        'confirming' => ['Confirming on-chain', 'The transfer has been seen and is waiting for confirmations. Credits are added automatically once it settles.'],
        'confirmed' => ['Confirmed', 'The payment has confirmed. Credits are being added to your account.'],
        'sending' => ['Settling', 'The payment is settling with our processor. Credits land shortly.'],
        'finished' => ['Paid', 'Credits have been added to your account.'],
        'partially_paid' => ['Underpaid', 'Less than the invoiced amount arrived. Nothing has been credited yet — contact support and we will reconcile it.'],
        'failed' => ['Payment failed', 'The payment did not complete. Nothing was charged and no credits were added.'],
        'expired' => ['Invoice expired', 'The invoice window closed before payment arrived. Start a new checkout when you are ready.'],
        'refunded' => ['Refunded', 'This payment was refunded. Any credits granted for it have been reversed.'],
    ];

    [$heading, $explanation] = $states[$charge->status] ?? ['Payment status', 'We are waiting for an update from the payment processor.'];
@endphp

<section class="py-14 md:py-20">
    <div class="shell max-w-2xl">
        <p class="text-sm text-graphite-500">Crypto payment</p>
        <h1 class="mt-2 text-4xl leading-[1.05]">{{ $heading }}</h1>
        <p class="mt-4 text-lg leading-relaxed text-graphite-600">{{ $explanation }}</p>

        <dl class="mt-10 divide-y divide-graphite-200 border-y border-graphite-200 text-[15px]">
            <div class="flex justify-between gap-6 py-4">
                <dt class="text-graphite-500">Buying</dt>
                <dd class="text-right">{{ number_format($charge->credits) }} credits</dd>
            </div>
            <div class="flex justify-between gap-6 py-4">
                <dt class="text-graphite-500">Price</dt>
                <dd class="text-right font-mono">${{ number_format($charge->price_cents / 100, 2) }}</dd>
            </div>
            <div class="flex justify-between gap-6 py-4">
                <dt class="text-graphite-500">Paying with</dt>
                <dd class="text-right">{{ $charge->assetLabel() }}</dd>
            </div>
            @if ($charge->transaction_hash)
                <div class="flex justify-between gap-6 py-4">
                    <dt class="text-graphite-500">Transaction</dt>
                    <dd class="text-right font-mono text-[13px] break-all">{{ $charge->transaction_hash }}</dd>
                </div>
            @endif
        </dl>

        @if (in_array($charge->status, ['created', 'waiting', 'confirming', 'confirmed', 'sending'], true) && $charge->checkout_url)
            <a href="{{ $charge->checkout_url }}" rel="noopener" class="btn btn-primary mt-8">Back to the invoice</a>
        @endif

        <p class="mt-8 text-sm leading-relaxed text-graphite-500">
            Crypto payments are one-off. Nothing renews automatically, and no wallet
            details are stored by Boss Of AI.
        </p>
    </div>
</section>
@endsection