@extends('layouts.admin')
@section('title', 'Edit Dokumen')

@section('content')
<div class="max-w-3xl mx-auto bg-white dark:bg-gray-800 rounded-xl p-6 shadow space-y-6">
    <h1 class="text-2xl font-bold text-gray-800 dark:text-white">✏️ Edit Dokumen</h1>

    <form action="{{ route('admin.library.update', $library) }}" method="POST" enctype="multipart/form-data" class="space-y-5">
        @csrf
        @method('PUT')

        {{-- Nama Dokumen --}}
        <div>
            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Nama Dokumen</label>
            <input type="text" name="name" value="{{ $library->name }}"
                   class="mt-1 block w-full rounded-lg border-gray-300 dark:bg-gray-700 dark:text-white shadow-sm focus:ring-primary focus:border-primary sm:text-sm" required>
        </div>

        {{-- Deskripsi --}}
        <div>
            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Deskripsi</label>
            <textarea name="description"
                      rows="4"
                      class="mt-1 block w-full rounded-lg border-gray-300 dark:bg-gray-700 dark:text-white shadow-sm focus:ring-primary focus:border-primary sm:text-sm">{{ $library->description }}</textarea>
        </div>

        {{-- Tipe File --}}
        <div>
            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Tipe Dokumen</label>
            <select name="file_type"
                    class="mt-1 block w-full rounded-lg border-gray-300 dark:bg-gray-700 dark:text-white shadow-sm focus:ring-primary focus:border-primary sm:text-sm">
                @foreach(['pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx'] as $ext)
                    <option value="{{ $ext }}" @selected($library->file_type == $ext)>{{ strtoupper($ext) }}</option>
                @endforeach
            </select>
        </div>

        {{-- Upload File --}}
        <div>
            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300">Upload File Baru (Opsional)</label>
            <input type="file" name="file" accept=".pdf,.doc,.docx,.xls,.xlsx,.ppt,.pptx"
                   class="mt-1 block w-full text-sm text-gray-900 dark:text-gray-300 bg-gray-50 dark:bg-gray-700 rounded-lg border border-gray-300 dark:border-gray-600 cursor-pointer focus:outline-none">
            <p class="text-sm text-gray-500 mt-1">Kosongkan jika tidak ingin mengganti file.</p>
        </div>

        {{-- Preview File --}}
        @if($library->file_type === 'pdf')
            <div>
                <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-1">Preview Dokumen</label>
                <iframe src="{{ asset('storage/' . $library->file_path) }}"
                        class="w-full h-80 rounded border" frameborder="0"></iframe>
            </div>
        @else
            <p class="text-sm text-gray-400 mt-2">
                File saat ini: <a href="{{ asset('storage/' . $library->file_path) }}" class="text-blue-500 underline" target="_blank">Download / Lihat File</a>
            </p>
        @endif

        {{-- Tombol --}}
        <div class="pt-4">
            <button type="submit"
                    class="w-full bg-[color:var(--primary-color)] text-white py-2 rounded-lg font-semibold hover:brightness-110 transition">
                💾 Simpan Perubahan
            </button>
        </div>
        <div class="pt-2 text-center">
            <a href="{{ route('admin.library.index') }}"
               class="inline-block text-sm text-gray-500 dark:text-gray-300 hover:underline hover:text-[color:var(--primary-color)] transition">
                ← Kembali ke Daftar Dokumen
            </a>
        </div>
    </form>
    @push('scripts')
<script>
    document.querySelector('input[name="file"]').addEventListener('change', function (e) {
        const file = e.target.files[0];
        const allowedExtensions = ['pdf', 'doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx'];
        const maxSize = 10 * 1024 * 1024; // 10 MB

        if (file) {
            const fileExt = file.name.split('.').pop().toLowerCase();
            if (!allowedExtensions.includes(fileExt)) {
                alert('Tipe file tidak didukung. Hanya PDF, DOC, DOCX, XLS, XLSX, PPT, PPTX.');
                e.target.value = '';
                return;
            }

            if (file.size > maxSize) {
                alert('Ukuran file maksimal 10MB.');
                e.target.value = '';
            }
        }
    });
</script>
@endpush

</div>
@endsection