@props(['users' => [], 'path' => ''])

@if(count($users) > 0)
    <div class="space-y-2">
        @foreach($users as $user)
            <div class="flex flex-col gap-3 rounded-lg border border-gray-200 bg-gray-50 px-4 py-3 dark:border-gray-700 dark:bg-gray-800 sm:flex-row sm:items-center sm:justify-between">
                <div class="flex items-center gap-3">
                    <x-filament::icon
                        icon="heroicon-o-user"
                        class="h-5 w-5 text-gray-400"
                    />
                    <span class="font-medium text-gray-900 dark:text-white">{{ $user }}</span>
                </div>
                <x-filament::button
                    size="sm"
                    color="danger"
                    icon="heroicon-o-trash"
                    wire:click="deleteProtectedDirUser('{{ $path }}', '{{ $user }}')"
                    wire:confirm="{{ __('Are you sure you want to remove this user?') }}"
                >
                    {{ __('Remove') }}
                </x-filament::button>
            </div>
        @endforeach
    </div>
@else
    <div class="rounded-lg border border-dashed border-gray-300 bg-gray-50 p-6 text-center dark:border-gray-600 dark:bg-gray-800">
        <x-filament::icon
            icon="heroicon-o-user-group"
            class="mx-auto h-8 w-8 text-gray-400"
        />
        <p class="mt-2 text-sm text-gray-500 dark:text-gray-400">
            {{ __('No users configured yet. Add a user below.') }}
        </p>
    </div>
@endif
