@props(['withdrawal'])

@php
    $dialogId = 'withdrawal-dialog-'.$withdrawal->id;
    $statusOptions = \App\Models\DebitCardTransaction::ADMIN_WITHDRAWAL_STATUS_OPTIONS;
@endphp

<dialog id="{{ $dialogId }}" class="vpm-dialog vpm-dialog--trader-form vpm-dialog--withdrawal-confirm" aria-labelledby="{{ $dialogId }}-title">
    <form method="POST" action="{{ route('admin.withdrawals.update', $withdrawal) }}" class="vpm-dialog__panel">
        @csrf
        <input type="hidden" name="_withdrawal" value="{{ $withdrawal->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 withdrawal status is updated, the change will be final, and the client will be notified accordingly. Please ensure that you have selected the correct status before proceeding.
                    </p>
                </header>

                <div class="vpm-admin-withdrawal-dialog__meta">
                    <p><span class="vpm-admin-withdrawal-dialog__label">Method:</span> {{ $withdrawal->adminMethodLabel() }}</p>
                    <p><span class="vpm-admin-withdrawal-dialog__label">From:</span> {{ $withdrawal->adminFromLabel() }}</p>
                    <p><span class="vpm-admin-withdrawal-dialog__label">Details:</span> {{ $withdrawal->adminDetailsLabel() }}</p>
                    <p><span class="vpm-admin-withdrawal-dialog__label">Current Status:</span> {{ $withdrawal->statusLabel() }}</p>

                    @if ($withdrawal->isReviewable())
                        <label class="vpm-field vpm-admin-withdrawal-dialog__status-field">
                            <span class="sr-only">Withdrawal status</span>
                            <select
                                name="status"
                                class="vpm-select vpm-dialog__status-select @if (! old('status') || old('_withdrawal') != $withdrawal->id) vpm-dialog__status-select--placeholder @endif"
                                required
                            >
                                <option value="" disabled @selected(! old('status') || old('_withdrawal') != $withdrawal->id)>Select withdrawal status</option>
                                @foreach ($statusOptions as $value => $label)
                                    <option
                                        value="{{ $value }}"
                                        @selected(old('_withdrawal') == $withdrawal->id && old('status') === $value)
                                    >
                                        {{ $label }}
                                    </option>
                                @endforeach
                            </select>
                        </label>
                        @if (old('_withdrawal') == $withdrawal->id)
                            @error('status')
                                <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 ($withdrawal->isReviewable())
                <x-vpm.button type="submit" variant="primary">Update</x-vpm.button>
            @endif
        </footer>
    </form>
</dialog>