cb28a6f8bb
Add {contentType: 'form'} to all edit template @put() calls so form
inputs are submitted by name rather than as Datastar signals. Replace
the quick notes text input on the brew edit page with toggle pill
buttons matching the add form. Add CLI tests for brew and cup update
commands.
99 lines
3.5 KiB
HTML
99 lines
3.5 KiB
HTML
{% extends "base.html" %}
|
|
{% import "partials/icons.html" as icons %}
|
|
{% block title %}Brewlog · Edit Bag{% endblock %}
|
|
|
|
{% block content %}
|
|
<header class="flex flex-col gap-2">
|
|
<h1 class="text-3xl font-semibold">Edit Bag</h1>
|
|
<p class="max-w-2xl text-sm text-text-secondary">Update bag details.</p>
|
|
</header>
|
|
|
|
<section class="rounded-lg border bg-surface p-5">
|
|
<form
|
|
class="flex flex-col gap-4"
|
|
data-signals:_submitting="false"
|
|
data-signals:_submit-error="''"
|
|
data-signals:_roast-date="'{{ roast_date }}'"
|
|
data-signals:_amount="{{ amount }}"
|
|
data-on:submit="$_submitting = true; $_submitError = ''; @put('/api/v1/bags/{{ id }}', {contentType: 'form'})"
|
|
data-on:datastar-fetch="if (!$_submitting) return;
|
|
if (evt.detail.type === 'finished') { $_submitting = false; sessionStorage.setItem('toast', 'Bag updated'); window.location.href = evt.detail.response.headers.get('location') || '/bags/{{ id }}' }
|
|
else if (evt.detail.type === 'error') { $_submitting = false; $_submitError = 'Failed to save changes.' }"
|
|
>
|
|
<div class="flex flex-col gap-1 text-sm">
|
|
<span
|
|
class="text-xs font-semibold text-text-muted uppercase tracking-wide"
|
|
>Roast*</span
|
|
>
|
|
<searchable-select
|
|
name="roast_id"
|
|
placeholder="Type to search roasts…"
|
|
initial-value="{{ roast_id }}"
|
|
>
|
|
{% for roast in roast_options %}
|
|
<button
|
|
type="button"
|
|
value="{{ roast.id }}"
|
|
data-display="{{ roast.label }}"
|
|
class="w-full px-3 py-2 text-left text-sm hover:bg-surface-alt transition"
|
|
>
|
|
<span class="font-medium text-text">{{ roast.name }}</span>
|
|
<span class="ml-2 text-xs text-text-muted"
|
|
>{{ roast.roaster_name }}</span
|
|
>
|
|
</button>
|
|
{% endfor %}
|
|
</searchable-select>
|
|
</div>
|
|
<div class="grid gap-4 sm:grid-cols-2">
|
|
<label class="flex flex-col gap-1 text-sm">
|
|
<span
|
|
class="text-xs font-semibold text-text-muted uppercase tracking-wide"
|
|
>Roast Date</span
|
|
>
|
|
<input
|
|
type="date"
|
|
name="roast_date"
|
|
class="input-field"
|
|
data-bind:_roast-date
|
|
/>
|
|
</label>
|
|
<label class="flex flex-col gap-1 text-sm">
|
|
<span
|
|
class="text-xs font-semibold text-text-muted uppercase tracking-wide"
|
|
>Amount (g)*</span
|
|
>
|
|
<input
|
|
type="number"
|
|
name="amount"
|
|
step="0.1"
|
|
required
|
|
aria-required="true"
|
|
class="input-field"
|
|
placeholder="250"
|
|
data-bind:_amount
|
|
/>
|
|
</label>
|
|
</div>
|
|
<p
|
|
data-show="$_submitError"
|
|
data-text="$_submitError"
|
|
style="display:none"
|
|
class="text-sm text-error"
|
|
role="alert"
|
|
></p>
|
|
<div class="flex items-center justify-end">
|
|
<button
|
|
type="submit"
|
|
class="inline-flex items-center justify-center gap-2 rounded-md bg-accent px-4 py-2 text-sm font-semibold text-accent-text transition hover:bg-accent-hover disabled:opacity-50"
|
|
data-attr:disabled="$_submitting"
|
|
>
|
|
<span data-show="$_submitting" style="display:none"
|
|
>{{ icons::spinner("h-4 w-4") }}</span
|
|
>
|
|
Save Changes
|
|
</button>
|
|
</div>
|
|
</form>
|
|
</section>
|
|
{% endblock %}
|