@push('styles')
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <meta name="submission-has-errors" content="{{ $errors->any() ? '1' : '0' }}">
@endpush

@push('scripts')
    @vite('resources/js/news-submissions.js')
@endpush

{{-- Server side errors summary --}}
@if($errors->any())
    @foreach( $errors->all() as $error )
        <x-form-error-text message="{{ $error }}" />
    @endforeach
@endif

<div class="block">
    <form action="{{ $isEdit ? route('news.update', [$news->id ]) : route('news.store') }}" method="POST" x-data="NewsSubmission()" x-init="init()" @submit.prevent="submitForm($event)">

        <x-form-group-title label="About the news" icon="puzzle" />
        <div class="form-group grid-c2">
            <div>
                <x-form-field-title name="Title" required="true" />
                <input class="form-input" type="text" name="title" value="{{ old('title', $news->title ?? '' ) }}" required>
                @error('title')
                     <x-form-error-text message="{{ $message }}" />
                @enderror
            </div>
            <div>
                <x-form-field-title name="Categories" required="true" />
                <x-category-selector section="news" :selected="$oldCategory" :required="true" :news="true" />
            </div>
        </div>

        <div class="form-group" x-ref="descriptionField">
            <x-form-field-title name="Content" helper="You must write in markdown. Click on the interrogation mark in the toolbar to learn more about Markdown." required="true" />
            <x-markdown-textarea name="description" value="{!! old('description', $news->description ?? '') !!}" />
            <div class="form-error-text" x-show="errorKey === 'noDescription'" x-text="errorMessage"></div>
            @error('description')
                <x-form-error-text message="{{ $message }}" />
            @enderror
        </div>

        <x-form-group-title label="Attachments" icon="paperclip" />
        <x-gallery-field :old-paths="old('gallery', $news->gallery->pluck('image')->toArray() ?? [] )"/>
        @error('gallery')
        <x-form-error-text message="{{ $message }}" />
        @enderror
        @error('gallery.*')
        <x-form-error-text message="{{ $message }}" />
        @enderror

        <x-form-group-title label="Related Links" icon="link" />
        <livewire:entry-selector :old-entry-id="old('entry_id', $news->entry_id )" />
        <div class="form-group grid-c2">
            <div>
                <x-form-field-title name="Release Site" required="" />
                <input class="form-input" type="url" name="release_site" value="{{ old( 'release_site', $news->relevant_link ?? '' ) }}">
            </div>
            <div>
                <x-form-field-title name="Youtube Video" required="" />
                <input class="form-input" type="url" name="youtube_video" value="{{ old( 'youtube_video', $news->youtube_link ?? '' ) }}">
            </div>
        </div>

        @if($isEdit)
            <x-form-group-title label="News Management" icon="wrench" />
            @can('moderate',$news)
                <div class="form-group grid-c2">
                    <div>
                        <x-form-field-title name="Staff comment" />
                        <textarea class="form-textarea" name="staff_comment" rows="3">{{ old('staff_comment', $entry->staff_comment ?? '' ) }}</textarea>
                    </div>
                    <div>
                        <x-form-field-title name="Owner" required="true" />
                        <livewire:xf-user-selector :initial-user-id="old('owner_user_id', $news->user_id)" />
                    </div>
                </div>
                <div class="form-group grid-c2">
                    <div>
                        <x-form-field-title name="XenForo Comments Thread ID" />
                        <input type="text" name="comments_thread_id" class="form-input" value="{{ old('comments_thread_id', $news->comments_thread_id) }}">
                    </div>
                </div>
                <div class="form-group">
                    <x-form-field-title name="Metadata" required="true" />
                    <div class="form-type-of-checkboxes form-group level" id="entry-metadata">
                    </div>
                </div>
            @endcan
            @cannot('moderate', $news)

            @endcannot
        @endif

        @csrf

        <div class="submit">
            <x-submit-entry-status section="news" :is-edit="$isEdit" :current-state="$news->state ?? null" :entry="$news" :news="true" />
            <button id="submit-button" type="submit" class="btn primary" style="padding:1%;">Submit</button>
        </div>

    </form>
</div>