@extends('layouts.universal', ['title' => 'AR Assets'])

@section('content')
    <div class="mb-4">
        <a href="{{ route('universal.augmented-realities.create') }}">
            <button type="button" class="bg-500 py-2 px-4 bg-green-500 rounded-md">
                New AR Asset
            </button>
        </a>
    </div>

    <div class="relative overflow-x-auto">
        <table class="w-full text-sm text-left text-gray-500 dark:text-gray-400">
            <thead class="text-xs text-gray-700 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400">
                <tr>
                    <th scope="col" class="px-6 py-3">
                        AR Asset Icon
                    </th>
                    <th scope="col" class="px-6 py-3">
                        AR Asset name
                    </th>
                    <th scope="col" class="px-6 py-3">
                        AR Asset Type
                    </th>
                </tr>
            </thead>
            <tbody>


                @forelse ($augmentedRealities as $augmentedReality)
                    <tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700">
                        <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
                            <x-thumbnail :media="$augmentedReality->icon" />
                        </td>
                        <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
                            {{ $augmentedReality->name }}
                        </td>
                        <td scope="row" class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white">
                            {{ $augmentedReality->asset_type }}
                        </td>
                    </tr>
                @empty
                    <tr class="bg-white border-b dark:bg-gray-800 dark:border-gray-700">
                        <td colspan="4"
                            class="px-6 py-4 font-medium text-gray-900 whitespace-nowrap dark:text-white text-center">
                            No AR assets found
                        </td>
                    </tr>
                @endforelse
            </tbody>
        </table>

        {{ $augmentedRealities->links() }}
    </div>
@endsection