@extends('layouts.admin')

@section('content')
<section class="admin-page-head compact">
    <div>
        <p class="eyebrow">Media library</p>
        <h1>Gallery</h1>
        <p>Upload product images once, then use their paths in product galleries and catalog grid items.</p>
    </div>
</section>

@if(session('notice'))
    <div class="notice success">{{ session('notice') }}</div>
@endif

<section class="admin-list-card">
    <form method="post" action="{{ route('admin.media.upload') }}" enctype="multipart/form-data" class="media-upload-form">
        @csrf
        <label>Upload Images<input type="file" name="media[]" accept="image/*" multiple required></label>
        <button class="button primary">Upload to Media</button>
    </form>

    <div class="media-grid">
        @forelse($files as $file)
            <article>
                <img src="{{ $file['url'] }}" alt="{{ $file['name'] }}" loading="lazy">
                <div>
                    <strong>{{ $file['name'] }}</strong>
                    <input readonly value="{{ $file['url'] }}" onclick="this.select()">
                    @if($file['editable'])
                        <form method="post" action="{{ route('admin.media.rename') }}" class="media-action-form">
                            @csrf
                            <input type="hidden" name="path" value="{{ $file['url'] }}">
                            <input name="name" value="{{ pathinfo($file['name'], PATHINFO_FILENAME) }}" aria-label="New file name">
                            <button class="button secondary" type="submit">Rename</button>
                        </form>
                        <form method="post" action="{{ route('admin.media.delete') }}" class="media-action-form" onsubmit="return confirm('Delete this image from media gallery? Product references will be cleaned.');">
                            @csrf
                            <input type="hidden" name="path" value="{{ $file['url'] }}">
                            <button class="button secondary danger-button" type="submit">Delete</button>
                        </form>
                    @else
                        <small class="hint">Built-in asset</small>
                    @endif
                </div>
            </article>
        @empty
            <p>No media files uploaded yet.</p>
        @endforelse
    </div>
</section>
@endsection