@props(['deposit'])

@php
    $user = $deposit->user;
    $dialogId = 'deposit-dialog-'.$deposit->id;
    $statusOptions = \App\Models\Deposit::ADMIN_STATUS_OPTIONS;
@endphp

<dialog id="{{ $dialogId }}" class="vpm-dialog vpm-dialog--trader-form vpm-dialog--deposit-confirm" aria-labelledby="{{ $dialogId }}-title">
    <form method="POST" action="{{ route('admin.deposits.update', $deposit) }}" class="vpm-dialog__panel">
        @csrf
        <input type="hidden" name="_deposit" value="{{ $deposit->id }}">

        <button type="button" class="vpm-dialog__close vpm-dialog__close--corner" data-vpm-dialog-close aria-label="Close">
            <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" aria-hidden="true">
                <path d="M18 6 6 18"/><path d="m6 6 12 12"/>
            </svg>
        </button>

        <div class="vpm-dialog__scroll">
            <div class="vpm-dialog__content">
                <header class="vpm-dialog__header vpm-dialog__header--form vpm-dialog__header--alert">
                    <h2 id="{{ $dialogId }}-title" class="vpm-dialog__title">Are you absolutely sure?</h2>
                    <p class="vpm-dialog__description">
                        This action is irreversible. Once the deposit status is updated, the change will be final, and the client will be notified accordingly. Ensure the payment has been sufficiently confirmed before approving.
                    </p>
                </header>

                <div class="vpm-admin-deposit-dialog__meta">
                    <p><span class="vpm-admin-deposit-dialog__label">Client:</span> {{ $user->name }}</p>
                    <p><span class="vpm-admin-deposit-dialog__label">Email:</span> {{ $user->email }}</p>
                    <p><span class="vpm-admin-deposit-dialog__label">Deposit ID:</span> {{ $deposit->reference }}</p>
                    <p><span class="vpm-admin-deposit-dialog__label">Amount:</span> {{ $deposit->formattedAmount() }}</p>
                    <p><span class="vpm-admin-deposit-dialog__label">Method:</span> {{ $deposit->paymentMethod->name ?? '—' }}</p>
                    @if ($deposit->plan_name || $deposit->plan_type)
                        <p><span class="vpm-admin-deposit-dialog__label">Plan:</span> {{ $deposit->listSubtitle() }}</p>
                    @endif
                    <p><span class="vpm-admin-deposit-dialog__label">Submitted:</span> {{ $deposit->created_at->format('D, d M Y H:i:s').' GMT' }}</p>
                    <p><span class="vpm-admin-deposit-dialog__label">Current Status:</span> {{ $deposit->statusLabel() }}</p>
                    @if ($deposit->proof_path)
                        <p>
                            <span class="vpm-admin-deposit-dialog__label">Proof:</span>
                            <a href="{{ $deposit->proofUrl() }}" target="_blank" rel="noopener" class="vpm-admin-deposit-dialog__proof">
                                View proof of payment
                            </a>
                        </p>
                    @endif
                    @if ($deposit->rejection_reason && ! $deposit->isPending())
                        <p><span class="vpm-admin-deposit-dialog__label">Rejection reason:</span> {{ $deposit->rejection_reason }}</p>
                    @endif

                    @if ($deposit->isPending())
                        <label class="vpm-field vpm-admin-deposit-dialog__status-field">
                            <span class="sr-only">Deposit status</span>
                            <select
                                name="status"
                                class="vpm-select vpm-dialog__status-select @if (! old('status') || old('_deposit') != $deposit->id) vpm-dialog__status-select--placeholder @endif"
                                required
                            >
                                <option value="" disabled @selected(! old('status') || old('_deposit') != $deposit->id)>Select deposit status</option>
                                @foreach ($statusOptions as $value => $label)
                                    <option
                                        value="{{ $value }}"
                                        @selected(old('_deposit') == $deposit->id && old('status') === $value)
                                    >
                                        {{ $label }}
                                    </option>
                                @endforeach
                            </select>
                        </label>
                        @if (old('_deposit') == $deposit->id)
                            @error('status')
                                <p class="vpm-auth-float__error" role="alert">{{ $message }}</p>
                            @enderror
                        @endif

                        <label class="vpm-field vpm-admin-deposit-dialog__reject-field">
                            <span class="vpm-field__label">Rejection reason</span>
                            <textarea
                                name="rejection_reason"
                                class="vpm-input"
                                rows="3"
                                maxlength="500"
                                placeholder="Payment not received on the blockchain…"
                            >{{ old('_deposit') == $deposit->id ? old('rejection_reason') : '' }}</textarea>
                        </label>
                        @if (old('_deposit') == $deposit->id)
                            @error('rejection_reason')
                                <p class="vpm-auth-float__error" role="alert">{{ $message }}</p>
                            @enderror
                        @endif
                    @endif
                </div>
            </div>
        </div>

        <footer class="vpm-dialog__footer vpm-dialog__footer--form">
            <x-vpm.button type="button" variant="secondary" data-vpm-dialog-close>Cancel</x-vpm.button>
            @if ($deposit->isPending())
                <x-vpm.button type="submit" variant="primary">Update</x-vpm.button>
            @endif
        </footer>
    </form>
</dialog>