@extends('admin.layouts.app')

@section('title', ($isEdit ? __('admin.data_library.edit') : __('admin.data_library.create')) . ' — ' . __('admin.brand.name'))
@section('page_title', $isEdit ? __('admin.data_library.edit') : __('admin.data_library.create'))

@section('content')
    <x-admin.page-header :title="$isEdit ? __('admin.data_library.edit') : __('admin.data_library.create')">
        <x-slot:actions>
            <a href="{{ route('admin.data-library.index') }}" class="btn-secondary">{{ __('admin.actions.back_to_list') }}</a>
        </x-slot:actions>
    </x-admin.page-header>

    <div class="card form-card">
        <form method="POST" action="{{ $isEdit ? route('admin.data-library.update', $file) : route('admin.data-library.store') }}" enctype="multipart/form-data" data-folder-form>
            @csrf
            @if ($isEdit) @method('PUT') @endif

            <div class="form-grid">
                <x-admin.form-select name="startup_id" :label="__('admin.data_library.fields.startup')"
                    :options="$startups->pluck('name', 'id')->toArray()"
                    :selected="$file->startup_id" required :placeholder="__('admin.filters.none')"
                    data-searchable-select />

                <div class="form-field">
                    <label for="folder">{{ __('admin.data_library.fields.folder') }} <span class="required">*</span></label>
                    <select id="folder" name="folder" required data-folder-select>
                        @foreach ($folders as $folder)
                            <option value="{{ $folder }}" @selected(old('folder', $file->folder) === $folder)>{{ $folder }}</option>
                        @endforeach
                        <option value="__new__" @selected(old('folder') === '__new__')>{{ __('admin.data_library.new_folder') }}</option>
                    </select>
                    @error('folder')<span class="field-error">{{ $message }}</span>@enderror
                </div>

                <div class="form-field form-field-full" data-folder-new-wrap hidden>
                    <label for="folder_new">{{ __('admin.data_library.new_folder_name') }}</label>
                    <input id="folder_new" type="text" name="folder_new" value="{{ old('folder_new') }}" placeholder="{{ __('admin.data_library.new_folder_placeholder') }}">
                    @error('folder_new')<span class="field-error">{{ $message }}</span>@enderror
                </div>

                <x-admin.form-toggle name="is_active" :label="__('admin.fields.status')" :checked="$file->is_active ?? true" />

                @if ($isEdit)
                    <div class="form-field">
                        <label>{{ __('admin.data_library.fields.current_file') }}</label>
                        <a href="{{ asset('storage/' . $file->file_path) }}" target="_blank" rel="noopener" class="btn-secondary">
                            {{ $file->file_name }}
                        </a>
                    </div>
                    <div class="form-field">
                        <label for="file">{{ __('admin.data_library.fields.replace_file') }}</label>
                        <input id="file" type="file" name="file" accept=".pdf,.doc,.docx,.xls,.xlsx,.csv,.jpg,.jpeg,.png,.gif,.webp,.ppt,.pptx">
                        @error('file')<span class="field-error">{{ $message }}</span>@enderror
                    </div>
                @else
                    <div class="form-field form-field-full">
                        <label for="files">{{ __('admin.data_library.fields.files') }} <span class="required">*</span></label>
                        <input id="files" type="file" name="files[]" multiple required accept=".pdf,.doc,.docx,.xls,.xlsx,.csv,.jpg,.jpeg,.png,.gif,.webp,.ppt,.pptx">
                        <small class="muted">{{ __('admin.data_library.files_hint') }}</small>
                        @error('files')<span class="field-error">{{ $message }}</span>@enderror
                        @error('files.*')<span class="field-error">{{ $message }}</span>@enderror
                    </div>
                @endif
            </div>

            <div class="form-actions">
                <a href="{{ route('admin.data-library.index') }}" class="btn-secondary">{{ __('admin.actions.cancel') }}</a>
                <button type="submit" class="btn-primary">{{ $isEdit ? __('admin.actions.save') : __('admin.actions.upload') }}</button>
            </div>
        </form>
    </div>
@endsection

@push('scripts')
    <script>
        (function ($) {
            var $form = $('[data-folder-form]');
            if (!$form.length) return;
            var $select = $form.find('[data-folder-select]');
            var $newWrap = $form.find('[data-folder-new-wrap]');
            function sync() {
                var isNew = $select.val() === '__new__';
                $newWrap.attr('hidden', !isNew);
                $newWrap.find('input').prop('required', isNew);
            }
            $select.on('change', sync);
            sync();
        })(jQuery);
    </script>
@endpush