Resource Pages

{{--
    Admin Form — create and edit as one page with two starting points.

    Creating a record and correcting one are the same set of decisions with
    a different starting point, so they share this page rather than each
    growing a field set that drifts. `mode="create"` renders it empty;
    `mode="edit"` renders it on an existing record.

    The composition follows the order the decisions are actually made: what
    kind of thing this is (which decides which fields exist AT ALL), what it
    does, who it applies to, what limits it, and when it runs. Each of those
    is one `admin/record-section`; the whole form reads top to bottom as a
    sentence. The end-side rail carries the consequence beside the work: a
    live summary of what will be written, then what still blocks saving,
    then the terminal actions — which never disappear, only disable with the
    reason beside them (`admin/save-blockers`, which also docks itself to the
    viewport bottom under `lg`, where the rail would otherwise sit a full
    page-scroll below the field being typed).

    Readiness is stated twice on purpose — as a pill in the page header and
    in the rail — because on a long form one of the two is always off screen.

    Server-first: every field is a real named control inside one POST form,
    validation errors come back through the shared `$errors` bag into
    `<x-ui.field>`, and the blockers list is whatever the host computes.
    A Livewire or Alpine host can bind the same props live.

    Generalised from the Noord-C admin's `discounts/form/page.blade.php`,
    `customers/form/page.blade.php` and `bundles/form/page.blade.php`.
    Left out as domain logic: the discount rule builder, the customer
    address lookup, the bundle component picker.
--}}
@props([
    'mode' => 'create',
    'title' => null,
    'subtitle' => null,
    'action' => '#',
    'method' => 'POST',
    'cancelHref' => '#',
    'recordHref' => '#',
    'duplicatedFrom' => null,
    'values' => null,
    'types' => null,
    'blockers' => null,
    'summary' => null,
])

@php
    // Shapes documented in item.json knowledge.props:
    //   duplicatedFrom: ['title', 'href'] — where a copy came from, and what was not copied, said before the operator goes looking.
    //   values: the record's current field values, keyed by input name.
    //   types: [['value', 'label', 'hint']] — the "what kind of thing" choice that decides which fields exist.
    //   blockers: the save-blockers `blockers` array; [] means the form is ready.
    //   summary: the fact-list `facts` array for the live summary card.
    $isEdit = $mode === 'edit';
    $title ??= $isEdit ? __('Edit discount') : __('New discount');
    $subtitle ??= $isEdit
        ? __('Changes apply to new orders only; orders that already used this code keep what they were given.')
        : __('A discount is a rule the checkout applies. Decide what kind it is first — that decides which fields exist.');

    $types ??= [
        ['value' => 'percentage', 'label' => __('Percentage off'), 'hint' => __('A share of the line price.')],
        ['value' => 'fixed', 'label' => __('Fixed amount off'), 'hint' => __('A sum off the order.')],
        ['value' => 'shipping', 'label' => __('Free shipping'), 'hint' => __('Waives the shipping fee.')],
    ];

    $values ??= $isEdit ? [
        'title' => 'Spring welcome',
        'type' => 'percentage',
        'code' => 'SPRING10',
        'value' => '10',
        'audience' => 'everyone',
        'minimum' => '25.00',
        'uses' => '500',
        'starts_at' => '2026-09-01',
        'ends_at' => '2026-10-31',
        'active' => true,
    ] : [
        'title' => '',
        'type' => 'percentage',
        'code' => '',
        'value' => '',
        'audience' => 'everyone',
        'minimum' => '',
        'uses' => '',
        'starts_at' => '',
        'ends_at' => '',
        'active' => false,
    ];

    $blockers ??= $isEdit ? [] : [
        ['field' => 'title', 'text' => __('Give the discount a name.'), 'target' => 'title'],
        ['field' => 'code', 'text' => __('Set the code customers will type.'), 'target' => 'code'],
        ['field' => 'value', 'text' => __('Set how much comes off.'), 'target' => 'value'],
    ];
    $ready = $blockers === [];

    $summary ??= [
        ['label' => __('Rule'), 'value' => $isEdit ? __('10% off orders over €25.00') : __('Not decided yet')],
        ['label' => __('Audience'), 'value' => __('Everyone')],
        ['label' => __('Ceiling'), 'value' => $isEdit ? __('500 uses') : __('No limit'), 'tone' => $isEdit ? null : 'attention'],
        ['label' => __('Window'), 'value' => $isEdit ? '1 Sep – 31 Oct 2026' : __('Open-ended')],
    ];

    $banners = $duplicatedFrom
        ? [[
            'tone' => 'info',
            'title' => __('Duplicated from :name', ['name' => $duplicatedFrom['title'] ?? '']),
            'body' => __('Everything was copied except the code, which has to be unique.'),
            'actionLabel' => $duplicatedFrom['title'] ?? __('Open original'),
            'actionHref' => $duplicatedFrom['href'] ?? '#',
        ]]
        : [];

    $trail = array_values(array_filter([
        ['label' => __('Discounts'), 'href' => '#'],
        $isEdit ? ['label' => $values['title'] ?? '', 'href' => $recordHref] : null,
        ['label' => $title],
    ]));
@endphp

<main
    id="main-content"
    data-slot="admin-form-page"
    data-surface="admin"
    data-mode="{{ $isEdit ? 'edit' : 'create' }}"
    {{ $attributes->merge(['class' => 'min-h-screen bg-background text-foreground']) }}
>
    <x-ui.admin.page-bar :title="$title" :trail="$trail" :record="[]" :nav-toggle="false" />

    <div class="mx-auto flex max-w-screen-2xl flex-col gap-6 px-4 py-6 pb-24 sm:px-6 lg:pb-6">
        <x-ui.admin.page-header :title="$title" :scope="$subtitle">
            <x-slot:actions>
                <x-ui.badge :tone="$ready ? 'positive' : 'attention'" size="status">
                    {{ $ready ? __('Ready to save') : trans_choice(':count thing missing|:count things missing', count($blockers), ['count' => count($blockers)]) }}
                </x-ui.badge>
                @if ($isEdit)
                    <x-ui.button variant="ghost" size="sm" :href="$recordHref">{{ __('Back to record') }}</x-ui.button>
                @endif
            </x-slot:actions>
        </x-ui.admin.page-header>

        <x-ui.admin.attention-banners :banners="$banners" />

        <x-ui.form :action="$action" :method="$method" class="grid items-start gap-6 !space-y-0 lg:grid-cols-[minmax(0,1fr)_20rem]">
            <div class="flex min-w-0 flex-col gap-6">
                <x-ui.admin.record-section id="section-kind" :title="__('What kind')" :hint="__('Decides which of the fields below exist. Locked once the discount has been used.')">
                    <x-ui.field name="title" :label="__('Name')" :hint="__('Internal. Customers see the code, not the name.')" required>
                        <x-ui.input id="title" :value="$values['title'] ?? ''" autocomplete="off" />
                    </x-ui.field>

                    <fieldset class="mt-6">
                        <legend class="text-sm font-medium">{{ __('Type') }}</legend>
                        <div class="mt-2 grid gap-2 sm:grid-cols-3">
                            @foreach ($types as $type)
                                <x-ui.choicebox
                                    type="radio"
                                    name="type"
                                    :value="$type['value']"
                                    :title="$type['label']"
                                    :description="$type['hint'] ?? null"
                                    :checked="($values['type'] ?? null) === $type['value']"
                                />
                            @endforeach
                        </div>
                    </fieldset>
                </x-ui.admin.record-section>

                <x-ui.admin.record-section id="section-value" :title="__('What the customer gets')" :hint="__('The code and the amount. A percentage over 50% is legitimate, but it is chosen on purpose.')">
                    <div class="grid gap-6 sm:grid-cols-2">
                        <x-ui.field name="code" :label="__('Code')" :hint="__('Upper-case letters and digits, 4–16 characters.')" required>
                            <x-ui.input id="code" :value="$values['code'] ?? ''" autocomplete="off" spellcheck="false" class="font-mono uppercase" />
                        </x-ui.field>
                        <x-ui.field name="value" :label="__('Value')" :hint="__('Percentage or amount, depending on the type.')" required>
                            <x-ui.input id="value" type="number" inputmode="decimal" min="0" step="0.01" :value="$values['value'] ?? ''" />
                        </x-ui.field>
                    </div>
                </x-ui.admin.record-section>

                <x-ui.admin.record-section id="section-audience" :title="__('Who may use it')" :hint="__('Everyone, or a segment. A minimum order keeps a code from being applied to a single low-value line.')">
                    <div class="grid gap-6 sm:grid-cols-2">
                        <x-ui.field name="audience" :label="__('Audience')">
                            <x-ui.select id="audience">
                                <option value="everyone" @selected(($values['audience'] ?? '') === 'everyone')>{{ __('Everyone') }}</option>
                                <option value="new" @selected(($values['audience'] ?? '') === 'new')>{{ __('First-time customers') }}</option>
                                <option value="segment" @selected(($values['audience'] ?? '') === 'segment')>{{ __('A segment…') }}</option>
                            </x-ui.select>
                        </x-ui.field>
                        <x-ui.field name="minimum" :label="__('Minimum order')" :hint="__('Leave empty for no minimum.')">
                            <x-ui.input id="minimum" type="number" inputmode="decimal" min="0" step="0.01" :value="$values['minimum'] ?? ''" />
                        </x-ui.field>
                    </div>
                </x-ui.admin.record-section>

                <x-ui.admin.record-section id="section-limits" :title="__('What limits it')" :hint="__('Without a ceiling a campaign can run away. State it here as a figure, before it runs.')">
                    <div class="grid gap-6 sm:grid-cols-2">
                        <x-ui.field name="uses" :label="__('Total uses')" :hint="__('Across all customers.')">
                            <x-ui.input id="uses" type="number" inputmode="numeric" min="0" step="1" :value="$values['uses'] ?? ''" />
                        </x-ui.field>
                        <x-ui.field name="notes" :label="__('Internal note')" :hint="__('Why this discount exists. Shown on the record, never to customers.')">
                            <x-ui.textarea id="notes" rows="3"></x-ui.textarea>
                        </x-ui.field>
                    </div>
                </x-ui.admin.record-section>

                <x-ui.admin.record-section id="section-window" :title="__('When it runs')" :hint="__('Time moves the window on its own; the switch is a decision a person makes. They are kept apart so a paused campaign is never confused with an expired one.')">
                    <div class="grid gap-6 sm:grid-cols-2">
                        <x-ui.field name="starts_at" :label="__('Starts')">
                            <x-ui.input id="starts_at" type="date" :value="$values['starts_at'] ?? ''" />
                        </x-ui.field>
                        <x-ui.field name="ends_at" :label="__('Ends')" :hint="__('Leave empty for an open-ended window.')">
                            <x-ui.input id="ends_at" type="date" :value="$values['ends_at'] ?? ''" />
                        </x-ui.field>
                    </div>
                    <div class="mt-6">
                        <x-ui.switch name="active" id="active" :label="__('Switched on')" :checked="(bool) ($values['active'] ?? false)" />
                    </div>
                </x-ui.admin.record-section>
            </div>

            <aside class="flex min-w-0 flex-col gap-6 lg:sticky lg:top-20" aria-label="{{ __('Summary and actions') }}">
                <x-ui.admin.record-section :title="__('Summary')" :hint="__('What saving would write.')">
                    <x-ui.fact-list :facts="$summary" />
                </x-ui.admin.record-section>

                <x-ui.admin.save-blockers
                    :blockers="$blockers"
                    :actions="[
                        ['label' => $isEdit ? __('Save changes') : __('Create discount'), 'primary' => true],
                        ['label' => __('Save as draft'), 'variant' => 'outline', 'requiresValid' => false],
                    ]"
                    :cancel-href="$cancelHref"
                    :note="__('⌘S saves. Blockers clear as each field is fixed.')"
                    :dock-label="__('Form actions')"
                />
            </aside>
        </x-ui.form>
    </div>
</main>