sprint_planer_web/views/sprints/new.php

<?php
/** @var string $csrfToken */
/** @var string $error */
/** @var array{name:string,start_date:string,end_date:string,reserve_fraction:string,n_weeks:string} $form */
use function App\Http\e;

$errorMessages = [
    'name_required'         => 'Sprint name is required.',
    'dates_invalid'         => 'Start and end dates must both be valid dates (YYYY-MM-DD).',
    'dates_order'           => 'End date must not be before start date.',
    'reserve_invalid'       => 'Reserve must be a number (0–100).',
    'reserve_out_of_range'  => 'Reserve must be between 0 and 100 percent.',
    'n_weeks_invalid'       => 'Weeks must be an integer.',
    'n_weeks_range'         => 'Weeks must be between 1 and 26.',
    'db_error'              => 'Could not save. Try again.',
];
?>
<section class="max-w-xl">
    <h1 class="text-2xl font-semibold tracking-tight">New sprint</h1>
    <p class="text-slate-600 mt-1 text-sm dark:text-slate-400">
        Worker membership, weekly availability and tasks are configured on the
        sprint page after creation.
    </p>

    <?php if ($error !== '' && isset($errorMessages[$error])): ?>
        <div class="mt-4 rounded-md border border-red-200 bg-red-50 px-4 py-3 text-sm text-red-800 dark:bg-red-900 dark:border-red-800 dark:text-red-200">
            <?= e($errorMessages[$error]) ?>
        </div>
    <?php endif; ?>

    <form method="post" action="/sprints" class="mt-6 space-y-4 rounded-lg border bg-white p-5 dark:bg-slate-800 dark:border-slate-700">
        <input type="hidden" name="_csrf" value="<?= e($csrfToken) ?>">

        <label class="block">
            <span class="text-sm text-slate-700 dark:text-slate-300">Name</span>
            <input name="name" type="text" required
                   value="<?= e($form['name']) ?>"
                   placeholder="e.g. Sprint 12"
                   class="mt-1 block w-full rounded-md border-slate-300 border shadow-sm px-3 py-2 focus:outline-none focus:ring-2 focus:ring-slate-400 dark:bg-slate-800 dark:border-slate-600 dark:text-slate-100 dark:focus:ring-slate-500">
        </label>

        <div class="grid grid-cols-2 gap-3">
            <label class="block">
                <span class="text-sm text-slate-700 dark:text-slate-300">Start date</span>
                <input name="start_date" type="date" required
                       value="<?= e($form['start_date']) ?>"
                       class="mt-1 block w-full rounded-md border-slate-300 border shadow-sm px-3 py-2 focus:outline-none focus:ring-2 focus:ring-slate-400 dark:bg-slate-800 dark:border-slate-600 dark:text-slate-100 dark:focus:ring-slate-500">
            </label>
            <label class="block">
                <span class="text-sm text-slate-700 dark:text-slate-300">End date</span>
                <input name="end_date" type="date" required
                       value="<?= e($form['end_date']) ?>"
                       class="mt-1 block w-full rounded-md border-slate-300 border shadow-sm px-3 py-2 focus:outline-none focus:ring-2 focus:ring-slate-400 dark:bg-slate-800 dark:border-slate-600 dark:text-slate-100 dark:focus:ring-slate-500">
            </label>
        </div>

        <div class="grid grid-cols-2 gap-3">
            <label class="block">
                <span class="text-sm text-slate-700 dark:text-slate-300">Reserve (%)</span>
                <input name="reserve_fraction" type="number" min="0" max="100" step="1" required
                       value="<?= e($form['reserve_fraction']) ?>"
                       class="mt-1 block w-full rounded-md border-slate-300 border shadow-sm px-3 py-2 font-mono focus:outline-none focus:ring-2 focus:ring-slate-400 dark:bg-slate-800 dark:border-slate-600 dark:text-slate-100 dark:focus:ring-slate-500">
                <span class="text-xs text-slate-500 dark:text-slate-400">Reduction from raw capacity. The Excel uses 20%.</span>
            </label>
            <label class="block">
                <span class="text-sm text-slate-700 dark:text-slate-300">Weeks</span>
                <input name="n_weeks" type="number" min="1" max="26" step="1" required
                       value="<?= e($form['n_weeks']) ?>"
                       class="mt-1 block w-full rounded-md border-slate-300 border shadow-sm px-3 py-2 font-mono focus:outline-none focus:ring-2 focus:ring-slate-400 dark:bg-slate-800 dark:border-slate-600 dark:text-slate-100 dark:focus:ring-slate-500">
                <span class="text-xs text-slate-500 dark:text-slate-400">Week rows get 5 days/week by default; edit on the sprint page.</span>
            </label>
        </div>

        <div class="flex gap-3 pt-2">
            <button type="submit"
                    class="rounded-md bg-slate-900 text-white px-4 py-2 text-sm font-medium hover:bg-slate-800 dark:bg-slate-700 dark:hover:bg-slate-600">
                Create sprint
            </button>
            <a href="/" class="inline-flex items-center rounded-md border border-slate-300 bg-white text-slate-700 px-4 py-2 text-sm hover:bg-slate-100 dark:bg-slate-800 dark:border-slate-600 dark:text-slate-200 dark:hover:bg-slate-700">
                Cancel
            </a>
        </div>
    </form>
</section>