@php
    $formatHours = function (?int $minutes): string {
        $minutes = max(0, (int) $minutes);
        $hours = intdiv($minutes, 60);
        $remainingMinutes = $minutes % 60;

        return $hours . 'h' . str_pad((string) $remainingMinutes, 2, '0', STR_PAD_LEFT);
    };
    $formatNumber = fn (mixed $value): string => rtrim(rtrim(number_format((float) $value, 1, ',', ' '), '0'), ',');
    $sleepTargetLines = [
        ['label' => 'Objectif', 'value' => 480, 'tone' => 'goal'],
        ['label' => 'Limite', 'value' => 540, 'tone' => 'limit'],
    ];
@endphp

<x-app-layout>
    <x-slot name="header">
        <div class="dashboard-header flex flex-col gap-1 sm:flex-row sm:items-end sm:justify-between">
            <div>
                <p class="dashboard-header__eyebrow">{{ __('Suivi quotidien') }}</p>
                <h2 class="dashboard-header__title mt-1 text-2xl leading-none sm:text-3xl">{{ __('Sommeil') }}</h2>
            </div>
            <div class="dashboard-action-row">
                @foreach ([7, 30, 90] as $periodOption)
                    <a href="{{ route('sleep.index', ['period' => $periodOption]) }}" class="dashboard-action {{ (int) $period === $periodOption ? 'dashboard-action--primary' : 'dashboard-action--secondary' }}">{{ trans_choice('ui.common.days', $periodOption, ['count' => $periodOption]) }}</a>
                @endforeach
                <button class="dashboard-action dashboard-action--primary" type="button" x-data="" x-on:click.prevent="$dispatch('open-modal', 'sleep-record-modal')">{{ __('Renseigner le sommeil') }}</button>
                <button class="dashboard-action dashboard-action--secondary" type="button" x-data="" x-on:click.prevent="$dispatch('open-modal', 'nap-record-modal')">{{ __('Renseigner une sieste') }}</button>
                <a href="{{ route('dashboard') }}" class="dashboard-action dashboard-action--secondary">{{ __('Retour dashboard') }}</a>
            </div>
        </div>
    </x-slot>

    <div class="dashboard-page module-page">
        <div class="dashboard-shell space-y-4">
            @if (session('status'))
                <div class="dashboard-empty text-sm">{{ session('status') }}</div>
            @endif

            <section class="dashboard-reference-metrics dashboard-reference-metrics--compact">
                <x-stats.metric-card :title="__('Sommeil aujourd’hui')" :value="$formatHours($currentSleep ?? 0)" :meta="__('Nuit du jour')" color="blue" />
                <x-stats.metric-card :title="__('Repos total')" :value="$formatHours($currentRest ?? 0)" :meta="__('Sieste :duration', ['duration' => $formatHours($currentNap ?? 0)])" color="amber" />
                <x-stats.metric-card :title="__('Repos total période')" :value="$formatHours(data_get($sleepSummary, 'total_rest_minutes'))" :trend="data_get($sleepTrends, 'total_rest_minutes')" :meta="trans_choice('ui.common.recorded_days', data_get($sleepSummary, 'active_day_count', 0), ['count' => data_get($sleepSummary, 'active_day_count', 0)])" color="green" />
                <x-stats.metric-card :title="__('Moyenne nuit')" :value="$formatHours(data_get($sleepSummary, 'average_sleep_minutes_per_recorded_night'))" :trend="data_get($sleepTrends, 'average_sleep_minutes_per_recorded_night')" :meta="trans_choice('ui.common.nights', data_get($sleepSummary, 'sleep_record_count', 0), ['count' => data_get($sleepSummary, 'sleep_record_count', 0)])" color="blue" />
                <x-stats.metric-card :title="__('Siestes')" :value="$formatHours(data_get($sleepSummary, 'total_nap_minutes'))" :trend="data_get($sleepTrends, 'total_nap_minutes')" :meta="trans_choice('ui.common.naps', data_get($sleepSummary, 'nap_count', 0), ['count' => data_get($sleepSummary, 'nap_count', 0)])" color="amber" />
                <x-stats.metric-card :title="__('Qualité')" :value="data_get($sleepSummary, 'average_quality_score') === null ? '—' : $formatNumber(data_get($sleepSummary, 'average_quality_score')) . '/10'" :trend="data_get($sleepTrends, 'average_quality_score')" :meta="__('Meilleur repos :duration', ['duration' => $formatHours(data_get($sleepSummary, 'best_day_rest_minutes'))])" color="green" />
            </section>

            <section class="module-chart-grid">
                <x-simple-line-chart :title="__('Sommeil nuit')" :subtitle="trans_choice('ui.common.days', $period, ['count' => $period])" :points="$sleepChart" unit="min" color="blue" :trend="data_get($sleepTrends, 'average_sleep_minutes_per_recorded_night')" :target-lines="$sleepTargetLines" />
                <x-simple-line-chart :title="__('Sommeil + siestes')" :subtitle="trans_choice('ui.common.days', $period, ['count' => $period])" :points="$sleepRestChart" unit="min" color="amber" :trend="data_get($sleepTrends, 'total_rest_minutes')" :target-lines="$sleepTargetLines" />
                <x-simple-line-chart :title="__('Heure de coucher')" :subtitle="trans_choice('ui.common.days', $period, ['count' => $period])" :points="$sleepBedtimeChart" unit="clock" color="blue" />
                <x-simple-line-chart :title="__('Heure de réveil')" :subtitle="trans_choice('ui.common.days', $period, ['count' => $period])" :points="$sleepWakeChart" unit="clock" color="green" />
            </section>
        </div>
    </div>

    <x-modal name="sleep-record-modal" maxWidth="lg" :show="old('_modal') === 'sleep-record-modal'">
        @include('partials.sleep-record-form', ['modalName' => 'sleep-record-modal'])
    </x-modal>

    <x-modal name="nap-record-modal" maxWidth="lg" :show="old('_modal') === 'nap-record-modal'">
        @include('partials.nap-record-form', ['modalName' => 'nap-record-modal'])
    </x-modal>
</x-app-layout>