@php($editing = $page->exists)
<x-admin.layout :title="$editing ? __('Edit :name', ['name' => $page->title]) : __('New page')">
    <x-slot:head>@vite('resources/js/rich-text.js')</x-slot:head>

    <x-admin.page-header :title="$editing ? __('Edit :name', ['name' => $page->title]) : __('New page')" :back="route('admin.cms.pages.index')" />

    <form method="POST" action="{{ $editing ? route('admin.cms.pages.update', $page) : route('admin.cms.pages.store') }}" class="grid max-w-6xl grid-cols-1 gap-6 lg:grid-cols-3">
        @csrf
        @if ($editing) @method('PUT') @endif

        <div class="space-y-6 lg:col-span-2">
            <x-admin.card :title="__('Content')">
                <div class="space-y-4">
                    <x-admin.input name="title" :label="__('Title')" :value="$page->title" maxlength="150" required />
                    <x-admin.rich-text name="content" :label="__('Text')" :value="$page->content" required />
                </div>
            </x-admin.card>

            <x-admin.card :title="__('Translations')">
                <x-admin.translation-fields :fields="['title' => [__('Title'), 'text'], 'content' => [__('Text'), 'rich']]" :values="old('translations', $page->translations ?? [])" />
            </x-admin.card>
        </div>

        <x-admin.card :title="__('Publishing')" class="self-start">
            <div class="space-y-4">
                <x-admin.input name="slug" :label="__('Slug')" :value="$page->slug" maxlength="100"
                               :hint="__('The apps request the page by this name. Leave empty to build it from the title.')" />
                <x-admin.select name="app" :label="__('Shown in')" :options="$apps" :value="$page->app" required />
                <x-admin.toggle name="is_active" :label="__('Published')" :checked="$page->is_active" />
            </div>
            <div class="mt-5 flex gap-2">
                <x-admin.button type="submit">{{ $editing ? __('Save changes') : __('Create page') }}</x-admin.button>
                <x-admin.button variant="secondary" :href="route('admin.cms.pages.index')">{{ __('Cancel') }}</x-admin.button>
            </div>
        </x-admin.card>
    </form>
</x-admin.layout>