@props([
    'versions' => collect(),   // Collection<WitnessStatementVersion>
])

<div {{ $attributes->merge(['class' => 'witness-version-history']) }}>
    <h6 class="fw-semibold text-uppercase text-muted small mb-3">
        <span class="mdi mdi-history" aria-hidden="true"></span>
        Version history
    </h6>

    @if($versions->isEmpty())
        <p class="text-muted small mb-0">No versions generated yet.</p>
    @else
        <ol class="list-unstyled mb-0 witness-timeline">
            @foreach($versions as $version)
                <li class="d-flex gap-3 pb-3">
                    <div class="text-center" style="width: 2rem;">
                        <span class="badge rounded-pill bg-primary">v{{ $version->version_number }}</span>
                    </div>
                    <div class="flex-grow-1">
                        <div class="fw-semibold small">
                            @if($version->document)
                                <a href="{{ route('documents.view', $version->document) }}" target="_blank" rel="noopener">
                                    {{ $version->document->display_name }}
                                </a>
                            @else
                                Witness Statement v{{ $version->version_number }}
                            @endif
                        </div>
                        <div class="text-muted small">
                            {{ $version->generated_at?->format('d/m/Y H:i') }}
                            @if($version->generatedBy)
                                · {{ $version->generatedBy->name }}
                            @endif
                        </div>
                    </div>
                </li>
            @endforeach
        </ol>
    @endif
</div>