@props(['activeTab' => 'overview'])
<div>

    <ul class="nav nav-tabs mb-4">
        <li class="nav-item">
            <a class="nav-link {{ $activeTab === 'overview' ? 'active' : '' }}"
               wire:click.prevent="setTab('overview')">
                Overview
            </a>
        </li>

        <li class="nav-item">
            <a class="nav-link {{ $activeTab === 'documents' ? 'active' : '' }}"
               wire:click.prevent="setTab('documents')">
                Documents
            </a>
        </li>

    </ul>

    <div wire:loading wire:target="setTab" class="p-3 w-100">
        @include('components.skeleton.tab-content')
    </div>

    <!-- Actual content panel -->
    <div wire:loading.remove wire:target="setTab" class="fade show">

        @if($activeTab === 'overview')
            <x-claim.claim-overview :claim="$claim"/>

        @elseif($activeTab === 'documents')
            <livewire:document-manager :owner="$claim"/>

        @endif

    </div>
</div>