{{-- Shared UX for admin create/edit modal forms.
     - Client-side validation (Bootstrap was-validated) before submit.
     - Double-submit protection: on a valid submit the button is disabled and
       shows a spinner until the page navigates.
     Mark a form with class="js-modal-form" and add `novalidate`.

     Server-side validation: controllers use $request->validate(), which redirects
     back with errors + old input. Each form carries <input name="form_key"> equal
     to its modal id; the snippet below re-opens that modal so errors are shown
     inline with the user's input preserved. --}}
@push('scripts')
<script>
document.addEventListener('DOMContentLoaded', function () {
    document.querySelectorAll('form.js-modal-form').forEach(function (form) {
        form.addEventListener('submit', function (e) {
            if (!form.checkValidity()) {
                e.preventDefault();
                e.stopPropagation();
                form.classList.add('was-validated');
                return;
            }
            var btn = form.querySelector('button[type="submit"]');
            if (btn) {
                if (btn.dataset.busy === '1') { e.preventDefault(); return; } // guard double-click
                btn.dataset.busy = '1';
                btn.disabled = true;
                btn.dataset.original = btn.innerHTML;
                btn.innerHTML = '<span class="spinner-border spinner-border-sm me-2" role="status" aria-hidden="true"></span>Saving…';
            }
        });
    });

    @if ($errors->any() && old('form_key'))
        var errModal = document.getElementById(@json(old('form_key')));
        if (errModal && window.bootstrap) { new bootstrap.Modal(errModal).show(); }
    @endif
});
</script>
@endpush