@php
    $modalName = $modalName ?? null;
    $selectedDate = $selectedDate ?? now();
    $showFormErrors = $errors->any() && (! $modalName || old('_modal') === $modalName);
@endphp

<form
    method="POST"
    action="{{ route('sleep.naps.store') }}"
    class="module-modal"
    data-validated-form
    novalidate
    @if ($modalName) data-reset-on-open="{{ $modalName }}" @endif
    data-has-server-errors="@js($errors->any() && (! $modalName || old('_modal') === $modalName))"
>
    @csrf
    @if ($modalName)
        <input type="hidden" name="_modal" value="{{ $modalName }}">
    @endif
    <div class="module-modal__header">
        <p class="dashboard-kicker">{{ __('Sommeil') }}</p>
        <h3 class="dashboard-title mt-1 text-xl leading-none">{{ __('Renseigner une sieste') }}</h3>
    </div>

    @if ($showFormErrors)
        <div class="module-form-alert mt-4">
            <p>{{ __('Certains champs obligatoires sont manquants ou invalides.') }}</p>
        </div>
    @endif

    <div class="module-form-grid mt-5">
        <label class="module-field">
            <span>{{ __('Jour') }}</span>
            <input name="nap_date" type="date" class="module-input" value="{{ old('nap_date', $selectedDate->toDateString()) }}" required>
            @error('nap_date')<small class="module-field-error">{{ $message }}</small>@enderror
        </label>
        <label class="module-field">
            <span>{{ __('Heure de début') }}</span>
            <input name="started_at" type="time" class="module-input" value="{{ old('started_at', now()->format('H:i')) }}" required>
            @error('started_at')<small class="module-field-error">{{ $message }}</small>@enderror
        </label>
        <label class="module-field">
            <span>{{ __('Heure de fin') }}</span>
            <input name="ended_at" type="time" class="module-input" value="{{ old('ended_at') }}">
            @error('ended_at')<small class="module-field-error">{{ $message }}</small>@enderror
        </label>
        <label class="module-field">
            <span>{{ __('Durée (minutes)') }}</span>
            <input name="duration_minutes" type="number" min="1" step="1" class="module-input" value="{{ old('duration_minutes') }}" placeholder="{{ __('Si l’heure de fin est vide') }}" data-required-without="ended_at">
            @error('duration_minutes')<small class="module-field-error">{{ $message }}</small>@enderror
        </label>
    </div>

    <div class="module-modal__actions">
        @if ($modalName)
            <button type="button" class="dashboard-action dashboard-action--secondary" x-on:click="$dispatch('close-modal', '{{ $modalName }}')">{{ __('Annuler') }}</button>
        @endif
        <button type="submit" class="dashboard-action dashboard-action--primary">{{ __('Enregistrer') }}</button>
    </div>
</form>