@php
    use App\Support\LoanPermissionCatalog;
    use App\Support\Navigation\WorkspaceEmbed;

    $intel = $employeeDirectoryIntel ?? [
        'on_leave' => 0,
        'active' => 0,
        'suspended' => 0,
        'deactivated' => 0,
        'positions' => [],
    ];
    $positions = $intel['positions'] ?? [];
    $visiblePositionLimit = 6;
    $visiblePositions = array_slice($positions, 0, $visiblePositionLimit);
    $extraPositions = array_slice($positions, $visiblePositionLimit);
    $currentEmployment = trim((string) request('employment_status', ''));
    $currentJobTitle = trim((string) request('job_title', ''));
    $currentLoginStatus = trim((string) request('login_status', ''));
    $onLeaveFilter = trim((string) request('on_leave', '')) === '1';
    $navPreserve = collect(request()->except(['page', 'export', 'cols']))->all();
    $intelUrl = function (array $overrides) use ($navPreserve): string {
        $params = array_merge($navPreserve, $overrides);
        foreach (['employment_status', 'job_title', 'on_leave', 'login_status'] as $key) {
            if (array_key_exists($key, $overrides) && ($overrides[$key] === null || $overrides[$key] === '')) {
                unset($params[$key]);
            }
        }

        return WorkspaceEmbed::routeUrl('loan.employees.index', $params)
            ?? route('loan.employees.index', $params);
    };
    $chipClass = function (bool $active): string {
        return $active
            ? 'inline-flex items-baseline gap-1 rounded px-1.5 py-0.5 font-medium bg-teal-50 text-teal-900'
            : 'inline-flex items-baseline gap-1 rounded px-1.5 py-0.5 font-medium text-slate-700 hover:bg-brand-muted hover:text-brand-dark';
    };
    $canCreate = $canCreateEmployee ?? LoanPermissionCatalog::actorCan(auth()->user(), 'employees.create');
@endphp

<div class="flex min-w-0 flex-1 flex-wrap items-center gap-x-2 gap-y-1" x-data="{ extraOpen: false }">
    @if ($canCreate)
        <x-loan.frame-or-modal-link
            :href="route('loan.employees.create')"
            class="inline-flex h-7 w-7 shrink-0 items-center justify-center rounded-lg border border-slate-200 bg-white text-lg font-semibold leading-none text-slate-700 shadow-sm hover:bg-slate-50"
            aria-label="Add employee"
            title="Add employee"
        >+</x-loan.frame-or-modal-link>
        <span class="hidden h-4 w-px bg-slate-200 sm:inline" aria-hidden="true"></span>
    @endif

    <x-loan.workspace-link
        :href="$intelUrl(['on_leave' => $onLeaveFilter ? '' : '1', 'employment_status' => 'active'])"
        class="{{ $chipClass($onLeaveFilter) }}"
    >
        <span class="tabular-nums font-bold">{{ number_format((int) ($intel['on_leave'] ?? 0)) }}</span>
        <span>On leave</span>
    </x-loan.workspace-link>
    <span class="text-slate-300" aria-hidden="true">|</span>
    <x-loan.workspace-link
        :href="$intelUrl(['employment_status' => $currentEmployment === 'active' ? '' : 'active'])"
        class="{{ $chipClass($currentEmployment === 'active') }}"
    >
        <span class="tabular-nums font-bold">{{ number_format((int) ($intel['active'] ?? 0)) }}</span>
        <span>Active</span>
    </x-loan.workspace-link>
    <span class="text-slate-300" aria-hidden="true">|</span>
    <x-loan.workspace-link
        :href="$intelUrl(['login_status' => $currentLoginStatus === \App\Support\EmployeeAccessStatus::ACTIVE ? '' : \App\Support\EmployeeAccessStatus::ACTIVE, 'employment_status' => 'active'])"
        class="{{ $chipClass($currentLoginStatus === \App\Support\EmployeeAccessStatus::ACTIVE) }}"
        title="Active staff who can sign in"
    >
        <span class="tabular-nums font-bold">{{ number_format((int) ($intel['login_ready'] ?? 0)) }}</span>
        <span>Can log in</span>
    </x-loan.workspace-link>
    <span class="text-slate-300" aria-hidden="true">|</span>
    <x-loan.workspace-link
        :href="$intelUrl(['login_status' => $currentLoginStatus === \App\Support\EmployeeAccessStatus::LOGIN_DISABLED_BY_HR ? '' : \App\Support\EmployeeAccessStatus::LOGIN_DISABLED_BY_HR, 'employment_status' => 'active'])"
        class="{{ $chipClass($currentLoginStatus === \App\Support\EmployeeAccessStatus::LOGIN_DISABLED_BY_HR) }}"
        title="Active staff with login disabled by HR"
    >
        <span class="tabular-nums font-bold">{{ number_format((int) ($intel['login_disabled'] ?? 0)) }}</span>
        <span>Login off</span>
    </x-loan.workspace-link>

    @foreach ($visiblePositions as $position)
        <span class="text-slate-300" aria-hidden="true">|</span>
        <x-loan.workspace-link
            :href="$intelUrl(['job_title' => $currentJobTitle === $position['title'] ? '' : $position['title'], 'employment_status' => 'active'])"
            class="{{ $chipClass($currentJobTitle === $position['title']) }}"
            :title="$position['title']"
        >
            <span class="tabular-nums font-bold">{{ number_format((int) $position['count']) }}</span>
            <span class="max-w-[9rem] truncate">{{ $position['title'] }}</span>
        </x-loan.workspace-link>
    @endforeach

    @if (count($extraPositions) > 0)
        <span class="text-slate-300" aria-hidden="true">|</span>
        <button
            type="button"
            class="inline-flex items-baseline gap-1 rounded px-1.5 py-0.5 font-semibold text-teal-800 hover:bg-teal-50"
            @click="extraOpen = !extraOpen"
            :aria-expanded="extraOpen"
        >
            <span x-text="extraOpen ? 'Hide' : '+{{ count($extraPositions) }} more'"></span>
        </button>
        <div x-show="extraOpen" x-cloak class="flex w-full flex-wrap items-center gap-x-2 gap-y-1">
            @foreach ($extraPositions as $position)
                <x-loan.workspace-link
                    :href="$intelUrl(['job_title' => $currentJobTitle === $position['title'] ? '' : $position['title'], 'employment_status' => 'active'])"
                    class="{{ $chipClass($currentJobTitle === $position['title']) }}"
                    :title="$position['title']"
                >
                    <span class="tabular-nums font-bold">{{ number_format((int) $position['count']) }}</span>
                    <span>{{ $position['title'] }}</span>
                </x-loan.workspace-link>
            @endforeach
        </div>
    @endif
</div>