@extends('layouts.admin')
@section('title', 'Kelola Media Sosial')
@section('content')
    <div class="flex justify-end mb-4">
        <a href="{{ route('admin.social-media.create') }}" class="bg-indigo-600 text-white px-4 py-2 rounded-md hover:bg-indigo-700">+ Tambah Link</a>
    </div>
    <div class="overflow-x-auto">
        <table class="min-w-full bg-white">
            <thead class="bg-gray-200">
                <tr>
                    <th class="py-3 px-4 text-left">Urutan</th>
                    <th class="py-3 px-4 text-left">Ikon</th>
                    <th class="py-3 px-4 text-left">Nama</th>
                    <th class="py-3 px-4 text-left">Status</th>
                    <th class="py-3 px-4 text-left">Aksi</th>
                </tr>
            </thead>
            <tbody>
                @forelse ($socials as $social)
                    <tr class="border-b">
                        <td class="py-3 px-4">{{ $social->display_order }}</td>
                        <td class="py-3 px-4">
                            @if($social->icon_path)
                                <img src="{{ asset('storage/' . $social->icon_path) }}" alt="{{ $social->name }}" class="h-8 w-8 object-contain">
                            @endif
                        </td>
                        <td class="py-3 px-4">{{ $social->name }}</td>
                        <td class="py-3 px-4">
                            <span class="px-2 inline-flex text-xs leading-5 font-semibold rounded-full {{ $social->is_active ? 'bg-green-100 text-green-800' : 'bg-red-100 text-red-800' }}">{{ $social->is_active ? 'Aktif' : 'Nonaktif' }}</span>
                        </td>
                        <td class="py-3 px-4 flex items-center space-x-2">
                            <a href="{{ route('admin.social-media.edit', $social) }}" class="text-indigo-600 hover:text-indigo-900">Edit</a>
                            <form action="{{ route('admin.social-media.destroy', $social) }}" method="POST" onsubmit="return confirm('Apakah Anda yakin ingin menghapus ini?');">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="text-red-600 hover:text-red-900">Hapus</button>
                            </form>
                        </td>
                    </tr>
                @empty
                    <tr><td colspan="5" class="text-center py-4">Tidak ada data media sosial.</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>
@endsection