@if(count($files) > 0)
<div class="grid gap-4 grid-cols-1 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3 xl:grid-cols-4">

    @forelse ($files as $file)
    @if ($file->fileType === 'application/pdf')
        <div class="grid-item p-4 border rounded-lg shadow-lg cursor-pointer transition transform hover:scale-105">
            <embed src="{{ asset($file->path) }}" type="application/pdf" class="w-full h-48 mb-4" />
            <div class="flex justify-center">
                <a href="{{ asset($file->path) }}" class="btn btn-primary" target="_blank">View
                    PDF</a>
            </div>
            <br>
            <p class="text-sm text-gray-500">Mood : <span
                class="font-semibold">{{ $file->eventmood }}</span></p>
        <p class="text-sm text-gray-500 limited-lines">Description : <span
                class="font-semibold">{{ $file->decription }}</span></p>

            {{-- <p class="text-sm text-gray-500">Mood: <span
            class="font-semibold">{{ $file->eventmood }}</span></p>
    <p class="text-sm text-gray-500">Uploaded by: <span
            class="font-semibold">{{ $file->user->name }}</span></p>
    <p class="text-sm text-gray-500">Email: <span
            class="font-semibold">{{ $file->user->email }}</span></p>
    <p class="text-sm text-gray-500">Phone Number: <span
            class="font-semibold">{{ $file->user->mobile }}</span></p> --}}
            <form class="max-w-sm mx-auto mt-4">
                <label for="countries" class="block mb-2 text-sm font-medium text-gray-900 dark:text-black">Select an
                    Rating</label>
                <select id="ratings"
                    class="ratings bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
                    data-file-id="{{ $file->id }}" data-user-id="{{ Auth::user()->id }}">
                    {{-- <option selected>Choose a Rating</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option> --}}

                    {{-- @if ($file['ratingNew'] === null) --}}
                    <option value="0" disabled>Select a Rating</option>
                    {{-- @else --}}
                    @for ($i = 1; $i <= 6; $i++)
                        <option value="{{ $i }}" {{ $file->ratingNew == $i ? 'selected' : '' }}>
                            {{ $i }}</option>
                    @endfor
                    {{-- @endif --}}
                </select>
            </form>
        </div>
    @else
        <div class="grid-item p-4 border rounded-lg shadow-lg cursor-pointer transition transform hover:scale-105"
            data-title="{{ $file->title }}" data-description="{{ $file->description }}">
            <img src="{{ asset($file->path) }}" alt="{{ $file->title }}"
                class="w-full max-h-[200px] h-auto object-contain rounded-lg" />
            <!-- information start -->
            <div class="flex justify-center">
                <a href="{{ asset($file->path) }}" class="btn btn-primary" target="_blank">View
                    Image</a>
            </div>
            <br>
            <p class="text-sm text-gray-500">Mood : <span
            class="font-semibold">{{ $file->eventmood }}</span></p>
    <p class="text-sm text-gray-500 limited-lines">Description : <span
            class="font-semibold">{{ $file->decription }}</span></p>
    {{-- <p class="text-sm text-gray-500">Email: <span
            class="font-semibold">{{ $file->user->email }}</span></p>
    <p class="text-sm text-gray-500">Phone Number: <span
            class="font-semibold">{{ $file->user->mobile }}</span></p> --}}

            <form class="max-w-sm mx-auto mt-4">
                <label for="countries" class="block mb-2 text-sm font-medium text-gray-900 dark:text-black">Select an
                    Rating</label>
                <select id="ratings"
                    class="ratings bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2.5 dark:bg-gray-700 dark:border-gray-600 dark:placeholder-gray-400 dark:text-white dark:focus:ring-blue-500 dark:focus:border-blue-500"
                    data-file-id="{{ $file->id }}" data-user-id="{{ Auth::user()->id }}">
                    {{-- <option selected>Choose a Rating</option>
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option> --}}
                    {{-- @if ($file['ratingNew'] === null) --}}
                    <option value="0" disabled>Select a Rating</option>
                    {{-- @else --}}
                    @for ($i = 1; $i <= 6; $i++)
                        <option value="{{ $i }}" {{ $file->ratingNew == $i ? 'selected' : '' }}>
                            {{ $i }}</option>
                    @endfor
                    {{-- @endif --}}
                </select>
            </form>
        </div>
    @endif
    @endforeach
</div>
@else
    <div class="flex justify-center">
        <p>No files found</p>
    </div>
    @endif
<div class="mt-4 pagination-links">
    {{ $files->links() }}
</div>