<x-dynamic-component :component="$layoutComponent">
    @php
        $formatContractType = fn ($contract): string => mb_strtoupper($contract->contract_type ?: 'cdi');
        $contractTypeModifier = fn ($contract): string => $contract->contract_type === 'cdd'
            ? ' contract-type-badge--cdd'
            : ' contract-type-badge--cdi';

        $statusBadgeModifier = fn ($contract): string => match ($contract->status) {
            'draft' => ' contract-status-badge--draft',
            'to_sign' => ' contract-status-badge--to-sign',
            'cancelled' => ' contract-status-badge--cancelled',
            'ended', 'superseded' => ' contract-status-badge--ended',
            default => '',
        };

        $formatDates = function ($contract): string {
            $start = $contract->started_on?->format('d/m/y') ?? '—';
            $end = $contract->ended_at ?? $contract->ends_on;

            if ($end) {
                return "{$start} → {$end->format('d/m/y')}";
            }

            if (! $contract->started_on) {
                return $start;
            }

            $days = max(0, (int) $contract->started_on->diffInDays(now()) + 1);

            return $start.' ('.$days.' jour'.($days > 1 ? 's' : '').')';
        };

        $formatAmplitude = function ($contract): string {
            $schedule = is_array($contract->weekly_schedule) ? $contract->weekly_schedule : [];
            $days = collect($schedule)->where('enabled', true)->count();
            $minutes = (int) ($contract->weekly_minutes ?? 0);

            if ($days === 0 && $minutes === 0) {
                return '—';
            }

            $hours = $minutes / 60;
            $hoursLabel = fmod($hours, 1.0) === 0.0
                ? (string) (int) $hours
                : str_replace('.', ',', rtrim(rtrim(number_format($hours, 2, '.', ''), '0'), '.'));

            return $days.'jrs | '.$hoursLabel.' hrs';
        };

        $contractUrl = fn ($contract): ?string => $activeTab === 'terminating'
            ? route($isParentView ? 'parent.contracts.end' : 'contracts.end', $contract)
            : route($isParentView ? 'parent.contracts.show' : 'contracts.show', $contract);

        $pdfUrl = fn ($contract): string => route($isParentView ? 'parent.contracts.pdf' : 'contracts.pdf', $contract);

        $canDelete = fn ($contract): bool => $contract->canBeDeletedBy(auth()->user());
        $deleteUrl = fn ($contract): string => route($isParentView ? 'parent.contracts.destroy' : 'contracts.destroy', $contract);
        $canAmend = fn ($contract): bool => $contract->status === 'active' && ! $contract->hasPendingAmendment();
        $amendmentStoreUrl = fn ($contract): string => route($isParentView ? 'parent.contracts.amendments.store' : 'contracts.amendments.store', $contract);
        $canReopen = fn ($contract): bool => $contract->canBeReopenedBy(auth()->user());
        $reopenUrl = fn ($contract): string => route($isParentView ? 'parent.contracts.reopen' : 'contracts.reopen', $contract);
        $canDuplicate = fn ($contract): bool => $contract->canBeDuplicatedBy(auth()->user());
        $duplicateUrl = fn ($contract): string => route($isParentView ? 'parent.contracts.duplicate' : 'contracts.duplicate', $contract);

        // Dossier de fin de contrat non annulé le plus récent : sert à savoir si on propose de la consulter
        // (déjà en cours) ou d'en ouvrir une (aucune en cours), et si elle est actée (bonne réception confirmée).
        $activeTermination = fn ($contract) => $contract->terminations->whereNull('cancelled_at')->sortByDesc('created_at')->first();
        $terminationActed = fn ($contract): bool => (bool) $activeTermination($contract)?->isAcknowledged();
        $hasTerminationInProgress = fn ($contract): bool => $activeTermination($contract) !== null && ! $terminationActed($contract);
        $canEnd = fn ($contract): bool => $contract->canBeEndedBy(auth()->user()) && ! $terminationActed($contract);
        $endUrl = fn ($contract): string => route($isParentView ? 'parent.contracts.end' : 'contracts.end', $contract);

        $sortUrl = function (string $column) use ($sort, $direction): string {
            $query = request()->except(['sort', 'direction', 'page']);

            if ($sort !== $column) {
                $query['sort'] = $column;
                $query['direction'] = 'asc';
            } elseif ($direction === 'asc') {
                $query['sort'] = $column;
                $query['direction'] = 'desc';
            }

            return request()->url().($query ? '?'.http_build_query($query) : '');
        };

        $sortIndicator = fn (string $column): string => $sort === $column ? ($direction === 'asc' ? '↑' : '↓') : '';
        $tabUrl = fn (string $tab): string => $isParentView ? route('parent.contracts', ['tab' => $tab]) : route('contracts.index', ['tab' => $tab]);

        $careTypeShortLabel = fn ($contract): ?string => match ($contract->care_type) {
            'incomplete_year' => 'année incomplète',
            'occasional' => 'garde occasionnelle',
            default => null,
        };

        $formatWeeklyDuration = function ($contract): string {
            $minutes = (int) ($contract->weekly_minutes ?? 0);

            if ($minutes <= 0) {
                return '—';
            }

            return sprintf('%dh%02d / sem.', intdiv($minutes, 60), $minutes % 60);
        };

        $formatHourlyRate = fn ($contract): string => $contract->hourly_rate_net
            ? number_format((float) $contract->hourly_rate_net, 2, ',', ' ').' €/h'
            : '—';

        $formatMonthlySalary = fn ($contract): string => $contract->monthly_salary_estimate
            ? number_format((float) $contract->monthly_salary_estimate, 2, ',', ' ').' € net'
            : '—';

        $formatSinceDate = function ($contract): string {
            $end = $contract->ended_at ?? $contract->ends_on;

            if (! $contract->started_on) {
                return 'Date de début à préciser';
            }

            if ($end) {
                return $contract->started_on->format('d/m/Y').' → '.$end->format('d/m/Y');
            }

            return 'Depuis le '.$contract->started_on->format('d/m/Y');
        };
    @endphp

    <div class="contracts-page contracts-list-page" x-data="{ shareCodeCopied: false, async copyShareCode(code) { try { await navigator.clipboard.writeText(code); this.shareCodeCopied = true; setTimeout(() => { this.shareCodeCopied = false; }, 2000); } catch {} } }">
        <header class="contract-page-header contracts-list-header">
            <div>
                <h1>Mes contrats</h1>
                @if ($shareCode ?? null)
                    <div class="profile-hero-meta-row">
                        <button type="button" class="profile-hero-share-code" x-on:click="copyShareCode('{{ $shareCode }}')" title="Copier {{ mb_strtolower($shareCodeLabel) }}">
                            <i class="ph-duotone" :class="shareCodeCopied ? 'ph-check' : 'ph-copy'" aria-hidden="true"></i>
                            <span>{{ $shareCodeLabel }} : <strong>{{ $shareCode }}</strong></span>
                        </button>
                    </div>
                @endif
            </div>
            @if ($isParentView)
                <div class="contracts-list-header-actions">
                    <a href="{{ route('parent.contracts.create') }}" class="dashboard-primary-button">
                        <i class="ph-duotone ph-file-plus" aria-hidden="true"></i><span class="contracts-list-header-action-label">Préparer un contrat</span>
                    </a>
                </div>
            @else
                <div class="contracts-list-header-actions">
                    @if ($activeTab === 'models')
                        <a href="{{ route('contracts.create', ['mode' => 'template']) }}" class="dashboard-primary-button">
                            <i class="ph-duotone ph-layout" aria-hidden="true"></i><span class="contracts-list-header-action-label">Créer un modèle</span>
                        </a>
                    @else
                        <a href="{{ route('contracts.create') }}" class="dashboard-primary-button">
                            <i class="ph-duotone ph-file-plus" aria-hidden="true"></i><span class="contracts-list-header-action-label">Projet de contrat</span>
                        </a>
                    @endif
                </div>
            @endif
        </header>

        <nav class="contracts-tabs" aria-label="Naviguer dans mes contrats">
            <a href="{{ $tabUrl('active') }}" @class(['contracts-tab', 'is-active' => $activeTab === 'active'])>
                Actifs
                <span @class(['contracts-tab-count', 'is-active' => $activeTab === 'active'])>{{ $activeContractsCount }}</span>
            </a>
            <a href="{{ $tabUrl('expired') }}" @class(['contracts-tab', 'is-active' => $activeTab === 'expired'])>
                Expirés
                <span @class(['contracts-tab-count', 'is-active' => $activeTab === 'expired'])>{{ $expiredContractsCount }}</span>
            </a>
            @if (($terminatingContractsCount ?? 0) > 0 || $activeTab === 'terminating')
                <a href="{{ $tabUrl('terminating') }}" @class(['contracts-tab', 'is-active' => $activeTab === 'terminating'])>
                    Fin de contrat
                    <span @class(['contracts-tab-count', 'is-active' => $activeTab === 'terminating'])>{{ $terminatingContractsCount ?? 0 }}</span>
                </a>
            @endif
            @unless ($isParentView)
                <div class="contracts-tabs-spacer"></div>
                <a href="{{ $tabUrl('models') }}" @class(['contracts-tab', 'is-active' => $activeTab === 'models'])>
                    Modèles
                    <span @class(['contracts-tab-count', 'is-active' => $activeTab === 'models'])>{{ $templatesCount ?? 0 }}</span>
                </a>
            @endunless
        </nav>

        @if ($activeTab === 'models')
            <div class="contract-models-intro">
                <i class="ph-duotone ph-lightbulb" aria-hidden="true"></i>
                <p><strong>Les modèles</strong> me permettent de préparer à l’avance les conditions habituelles d’un contrat (rémunération, horaires, congés…). Je les partage ensuite à un parent employeur : il crée son contrat en un clic avec ces conditions déjà remplies, il n’a plus qu’à le compléter, de quoi aller plus vite jusqu’à la signature.</p>
            </div>

            @if (($templates ?? collect())->isNotEmpty())
                <div class="employers-table contracts-table">
                    <table class="employers-data-table contracts-data-table">
                        <thead>
                            <tr>
                                <th scope="col">Modèle</th>
                                <th scope="col">Type</th>
                                <th scope="col">Amplitude</th>
                                <th scope="col">Salaire net estimé</th>
                                <th scope="col">Dernier partage</th>
                                <th scope="col" class="employers-table-actions-head">Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($templates as $template)
                                @php
                                    $templateUrl = route('contract-templates.edit', $template);
                                @endphp
                                <tr
                                    class="employers-data-row contracts-data-row"
                                    tabindex="0"
                                    data-contract-row-url="{{ $templateUrl }}"
                                    x-data="{ open: false }"
                                    x-on:click.outside="open = false"
                                    x-bind:class="{ 'contracts-data-row--actions-open': open }"
                                >
                                    <td><a href="{{ $templateUrl }}" class="contracts-row-name contracts-row-name-link">{{ $template->title }}</a></td>
                                    <td class="contracts-type-cell">
                                        <span class="contract-type-badge{{ $template->contract_type === 'cdd' ? ' contract-type-badge--cdd' : ' contract-type-badge--cdi' }}">{{ mb_strtoupper($template->contract_type) }}</span>
                                    </td>
                                    <td class="contracts-done-meta">{{ $formatAmplitude($template) }}</td>
                                    <td class="contracts-done-meta">{{ $template->monthly_salary_estimate ? number_format((float) $template->monthly_salary_estimate, 2, ',', ' ') . ' €' : '—' }}</td>
                                    <td class="contracts-done-meta">{{ $template->shared_at?->diffForHumans() ?? 'Jamais' }}</td>
                                    <td>
                                        <div class="contracts-row-actions contracts-row-actions--table">
                                            <button type="button" class="contracts-icon-button" x-on:click="open = ! open" :aria-expanded="open.toString()" aria-haspopup="menu" aria-label="Actions pour {{ $template->title }}">
                                                <i class="ph-duotone ph-dots-three-vertical" aria-hidden="true"></i>
                                            </button>
                                            <div class="employer-action-dropdown contracts-action-dropdown" x-show="open" x-cloak role="menu">
                                                <form method="post" action="{{ route('contract-templates.destroy', $template) }}" x-on:submit.prevent="$store.confirmDialog.ask({ title: 'Supprimer ce modèle ?', onConfirm: () => $el.submit() })">
                                                    @csrf
                                                    @method('delete')
                                                    <button type="submit" class="employer-action-danger" role="menuitem">
                                                        <i class="ph-duotone ph-trash" aria-hidden="true"></i>Supprimer le modèle
                                                    </button>
                                                </form>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            @else
                <div class="employers-empty">
                    <i class="ph-duotone ph-copy" aria-hidden="true"></i>
                    <strong>Je n’ai pas encore de modèle.</strong>
                </div>
            @endif
        @elseif ($contracts->count() > 0)
            <div class="employers-table contracts-table">
                <table class="employers-data-table contracts-data-table">
                    <thead>
                        <tr>
                            <th scope="col">
                                <a href="{{ $sortUrl('child') }}" class="employers-sort-link">Enfant<span>{{ $sortIndicator('child') }}</span></a>
                            </th>
                            <th scope="col">
                                <a href="{{ $sortUrl($isParentView ? 'assistant' : 'parent') }}" class="employers-sort-link">{{ $isParentView ? 'Mon assistante maternelle' : 'Parent' }}<span>{{ $sortIndicator($isParentView ? 'assistant' : 'parent') }}</span></a>
                            </th>
                            <th scope="col">
                                <a href="{{ $sortUrl('status') }}" class="employers-sort-link">État<span>{{ $sortIndicator('status') }}</span></a>
                            </th>
                            <th scope="col">
                                <a href="{{ $sortUrl('type') }}" class="employers-sort-link">Type<span>{{ $sortIndicator('type') }}</span></a>
                            </th>
                            <th scope="col">Débuté le</th>
                            <th scope="col">Amplitude</th>
                            <th scope="col" class="employers-table-actions-head">Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach ($contracts as $contract)
                            @php
                                $child = $contract->child;
                                $employer = $child?->employer;
                                $rowUrl = $contractUrl($contract);
                            @endphp
                            <tr
                                class="employers-data-row contracts-data-row"
                                x-data="{ open: false }"
                                x-on:click.outside="open = false"
                                x-bind:class="{ 'contracts-data-row--actions-open': open }"
                                @if ($rowUrl)
                                    tabindex="0"
                                    data-contract-row-url="{{ $rowUrl }}"
                                @endif
                            >
                                <td>
                                    <div class="contracts-row-child">
                                        <x-child-avatar :child="$child" />
                                        @if ($rowUrl)
                                            <a href="{{ $rowUrl }}" class="contracts-row-name contracts-row-name-link">{{ $child?->display_name ?? 'Mon enfant' }}</a>
                                        @else
                                            <span class="contracts-row-name">{{ $child?->display_name ?? 'Mon enfant' }}</span>
                                        @endif
                                    </div>
                                </td>
                                <td class="contracts-done-meta">{{ $isParentView ? ($contract->assistant()?->name ?: 'Mon assistante maternelle reste à renseigner') : ($employer?->display_name ?: 'Parent non renseigné') }}</td>
                                <td class="contracts-status-cell">
                                    <span class="contract-status-badge{{ $statusBadgeModifier($contract) }}">
                                        <i class="ph-duotone ph-circle" aria-hidden="true"></i>{{ $contract->statusLabel() }}
                                    </span>
                                </td>
                                <td class="contracts-type-cell">
                                    <span class="contract-type-badge{{ $contractTypeModifier($contract) }}">{{ $formatContractType($contract) }}</span>
                                </td>
                                <td class="contracts-done-meta">{{ $formatDates($contract) }}</td>
                                <td class="contracts-done-meta">{{ $formatAmplitude($contract) }}</td>
                                <td>
                                    <div class="contracts-row-actions contracts-row-actions--table">
                                        <button type="button" class="contracts-icon-button" x-on:click="open = ! open" :aria-expanded="open.toString()" aria-haspopup="menu" aria-label="Actions pour {{ $child?->display_name ?? 'ce contrat' }}">
                                            <i class="ph-duotone ph-dots-three-vertical" aria-hidden="true"></i>
                                        </button>
                                        <div class="employer-action-dropdown contracts-action-dropdown" x-show="open" x-cloak role="menu">
                                            <a href="{{ $pdfUrl($contract) }}" role="menuitem">
                                                <i class="ph-duotone ph-file-pdf" aria-hidden="true"></i>Télécharger le contrat
                                            </a>
                                            @if ($hasTerminationInProgress($contract))
                                                <a href="{{ $endUrl($contract) }}" role="menuitem">
                                                    <i class="ph-duotone ph-eye" aria-hidden="true"></i>Consulter la fin de contrat
                                                </a>
                                            @elseif ($canEnd($contract))
                                                <a href="{{ $endUrl($contract) }}" role="menuitem">
                                                    <i class="ph-duotone ph-flag-checkered" aria-hidden="true"></i>Mettre fin au contrat
                                                </a>
                                            @endif
                                            @if ($canAmend($contract))
                                                <form method="post" action="{{ $amendmentStoreUrl($contract) }}">
                                                    @csrf
                                                    <button type="submit" role="menuitem">
                                                        <i class="ph-duotone ph-note-pencil" aria-hidden="true"></i>Faire un avenant
                                                    </button>
                                                </form>
                                            @endif
                                            @if ($canReopen($contract))
                                                <form method="post" action="{{ $reopenUrl($contract) }}">
                                                    @csrf
                                                    @method('patch')
                                                    <button type="submit" role="menuitem">
                                                        <i class="ph-duotone ph-arrow-counter-clockwise" aria-hidden="true"></i>Rouvrir le contrat
                                                    </button>
                                                </form>
                                            @endif
                                            @if ($canDuplicate($contract))
                                                <form method="post" action="{{ $duplicateUrl($contract) }}">
                                                    @csrf
                                                    <button type="submit" role="menuitem">
                                                        <i class="ph-duotone ph-copy" aria-hidden="true"></i>Dupliquer le contrat
                                                    </button>
                                                </form>
                                            @endif
                                            @if ($canDelete($contract))
                                                <form method="post" action="{{ $deleteUrl($contract) }}" x-on:submit.prevent="$store.confirmDialog.ask({ title: 'Supprimer ce contrat ?', onConfirm: () => $el.submit() })">
                                                    @csrf
                                                    @method('delete')
                                                    <button type="submit" class="employer-action-danger" role="menuitem">
                                                        <i class="ph-duotone ph-trash" aria-hidden="true"></i>Supprimer le contrat
                                                    </button>
                                                </form>
                                            @endif
                                        </div>
                                    </div>
                                </td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
            <div class="employers-pagination">
                {{ $contracts->links() }}
            </div>

            <div class="contracts-mobile-list">
                @foreach ($contracts as $contract)
                    @php
                        $child = $contract->child;
                        $employer = $child?->employer;
                        $rowUrl = $contractUrl($contract);
                        $metaName = $isParentView ? ($contract->assistant()?->name ?: 'Mon assistante maternelle reste à renseigner') : ($employer?->display_name ?: 'Parent non renseigné');
                        $metaCareType = $careTypeShortLabel($contract);
                    @endphp
                    <article
                        class="contract-mobile-card"
                        x-data="{ open: false }"
                        x-on:click.outside="open = false"
                        @if ($rowUrl)
                            tabindex="0"
                            data-contract-row-url="{{ $rowUrl }}"
                        @endif
                    >
                        <div class="contract-mobile-card-link">
                            <h2 @class(['contract-mobile-card-name', 'contract-mobile-card-name--with-avatar' => $child?->avatar])>
                                <x-child-avatar :child="$child" />
                                @if ($rowUrl)
                                    <a href="{{ $rowUrl }}">{{ $child?->display_name ?? 'Mon enfant' }}</a>
                                @else
                                    {{ $child?->display_name ?? 'Mon enfant' }}
                                @endif
                            </h2>
                            <p class="contract-mobile-card-meta">{{ $metaName }}{{ $metaCareType ? ' · '.$metaCareType : '' }}</p>
                        </div>
                        <div class="contract-mobile-card-badges">
                            <span class="contract-status-badge{{ $statusBadgeModifier($contract) }}">
                                <i class="ph-duotone ph-circle" aria-hidden="true"></i>{{ $contract->statusLabel() }}
                            </span>
                            <span class="contract-mobile-card-date-pill">{{ $formatSinceDate($contract) }}</span>
                        </div>
                        <div class="contract-mobile-card-stats">
                            <div>
                                <span class="contract-mobile-card-stat-label">Amplitude</span>
                                <strong>{{ $formatWeeklyDuration($contract) }}</strong>
                            </div>
                            <div>
                                <span class="contract-mobile-card-stat-label">Taux net</span>
                                <strong>{{ $formatHourlyRate($contract) }}</strong>
                            </div>
                        </div>
                        <div class="contract-mobile-card-stats">
                            <div>
                                <span class="contract-mobile-card-stat-label">Salaire mensualisé</span>
                                <strong>{{ $formatMonthlySalary($contract) }}</strong>
                            </div>
                        </div>
                        <div class="contracts-row-actions contract-mobile-card-actions">
                            <button type="button" class="contracts-icon-button" x-on:click.stop.prevent="open = ! open" :aria-expanded="open.toString()" aria-haspopup="menu" aria-label="Actions pour {{ $child?->display_name ?? 'ce contrat' }}">
                                <i class="ph-duotone ph-dots-three-vertical" aria-hidden="true"></i>
                            </button>
                            <div class="employer-action-dropdown contracts-action-dropdown" x-show="open" x-cloak role="menu">
                                <a href="{{ $pdfUrl($contract) }}" role="menuitem">
                                    <i class="ph-duotone ph-file-pdf" aria-hidden="true"></i>Télécharger le contrat
                                </a>
                                @if ($hasTerminationInProgress($contract))
                                    <a href="{{ $endUrl($contract) }}" role="menuitem">
                                        <i class="ph-duotone ph-eye" aria-hidden="true"></i>Consulter la fin de contrat
                                    </a>
                                @elseif ($canEnd($contract))
                                    <a href="{{ $endUrl($contract) }}" role="menuitem">
                                        <i class="ph-duotone ph-flag-checkered" aria-hidden="true"></i>Mettre fin au contrat
                                    </a>
                                @endif
                                @if ($canAmend($contract))
                                    <form method="post" action="{{ $amendmentStoreUrl($contract) }}">
                                        @csrf
                                        <button type="submit" role="menuitem">
                                            <i class="ph-duotone ph-note-pencil" aria-hidden="true"></i>Faire un avenant
                                        </button>
                                    </form>
                                @endif
                                @if ($canReopen($contract))
                                    <form method="post" action="{{ $reopenUrl($contract) }}">
                                        @csrf
                                        @method('patch')
                                        <button type="submit" role="menuitem">
                                            <i class="ph-duotone ph-arrow-counter-clockwise" aria-hidden="true"></i>Rouvrir le contrat
                                        </button>
                                    </form>
                                @endif
                                @if ($canDuplicate($contract))
                                    <form method="post" action="{{ $duplicateUrl($contract) }}">
                                        @csrf
                                        <button type="submit" role="menuitem">
                                            <i class="ph-duotone ph-copy" aria-hidden="true"></i>Dupliquer le contrat
                                        </button>
                                    </form>
                                @endif
                                @if ($canDelete($contract))
                                    <form method="post" action="{{ $deleteUrl($contract) }}" x-on:submit.prevent="$store.confirmDialog.ask({ title: 'Supprimer ce contrat ?', onConfirm: () => $el.submit() })">
                                        @csrf
                                        @method('delete')
                                        <button type="submit" class="employer-action-danger" role="menuitem">
                                            <i class="ph-duotone ph-trash" aria-hidden="true"></i>Supprimer le contrat
                                        </button>
                                    </form>
                                @endif
                            </div>
                        </div>
                    </article>
                @endforeach
            </div>
        @else
            <div class="employers-empty">
                <i class="ph-duotone ph-file-text" aria-hidden="true"></i>
                <strong>Je n’ai pas encore de contrat.</strong>
            </div>
        @endif
    </div>
</x-dynamic-component>