fix(brews): improve form defaults and table layout

- Prepopulate form inputs with default values (15g, 6.0 grind, 250ml, 91°C)
- Combine weight/water/ratio into single "Recipe" column
- Reorder columns: Coffee, Grind, Recipe, Temp, Brewer, Date, Actions
- Use trash icon button for delete action (consistent with roasts table)
This commit is contained in:
Jon Seager 2026-02-02 19:42:50 +00:00
parent 8aa72b55eb
commit 7e579cb2d1
No known key found for this signature in database

View file

@ -9,15 +9,13 @@
<thead class="bg-amber-200/60 text-xs font-semibold tracking-wide text-amber-900">
<tr>
<th scope="col" class="px-4 py-3">Coffee</th>
{% call table::sortable_header("Weight", "coffee-weight", navigator, "#brew-list") %}
<th scope="col" class="px-4 py-3">Grind</th>
<th scope="col" class="px-4 py-3">Brewer</th>
{% call table::sortable_header("Water", "water-volume", navigator, "#brew-list") %}
<th scope="col" class="px-4 py-3">Recipe</th>
<th scope="col" class="px-4 py-3">Temp</th>
<th scope="col" class="px-4 py-3">Ratio</th>
<th scope="col" class="px-4 py-3">Brewer</th>
{% call table::sortable_header("Date", "created-at", navigator, "#brew-list") %}
{% if is_authenticated %}
<th scope="col" class="px-4 py-3 w-12"></th>
<th scope="col" class="px-4 py-3 text-right">Actions</th>
{% endif %}
</tr>
</thead>
@ -36,23 +34,33 @@
</a>
</div>
</td>
<td class="px-4 py-3 whitespace-nowrap">{{ brew.coffee_weight }}</td>
<td class="px-4 py-3 whitespace-nowrap">
<div>{{ brew.grind_setting }}</div>
<div class="text-xs text-stone-500">{{ brew.grinder_name }}</div>
</td>
<td class="px-4 py-3 whitespace-nowrap">{{ brew.brewer_name }}</td>
<td class="px-4 py-3 whitespace-nowrap">{{ brew.water_volume }}</td>
<td class="px-4 py-3 whitespace-nowrap">
<div>{{ brew.coffee_weight }} / {{ brew.water_volume }}</div>
<div class="text-xs text-stone-500 font-mono">{{ brew.ratio }}</div>
</td>
<td class="px-4 py-3 whitespace-nowrap">{{ brew.water_temp }}</td>
<td class="px-4 py-3 whitespace-nowrap font-mono text-xs">{{ brew.ratio }}</td>
<td class="px-4 py-3 whitespace-nowrap">{{ brew.brewer_name }}</td>
<td class="px-4 py-3 whitespace-nowrap text-stone-500">{{ brew.created_at }}</td>
{% if is_authenticated %}
<td class="px-4 py-3 whitespace-nowrap text-right">
<td class="px-4 py-3 text-right">
<button
class="text-red-600 hover:text-red-800 text-xs"
type="button"
class="inline-flex h-8 w-8 items-center justify-center rounded-md text-stone-500 transition hover:text-red-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-red-500"
title="Delete brew"
data-on:click="confirm('Delete this brew?') && @delete('/api/v1/brews/{{ brew.id }}?{{ navigator.query() }}', {responseOverrides: {selector: '#brew-list', mode: 'replace'}})"
>
Delete
<span class="sr-only">Delete</span>
<svg class="h-4 w-4" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
<path
fill-rule="evenodd"
d="M7.5 3a1 1 0 0 1 1-1h3a1 1 0 0 1 1 1H15a1 1 0 1 1 0 2h-.4l-.74 10.36A2 2 0 0 1 11.87 17H8.13a2 2 0 0 1-1.99-1.64L5.4 5H5a1 1 0 1 1 0-2h2.5Zm.9 4.5a.75.75 0 0 1 .75.75v6a.75.75 0 1 1-1.5 0v-6a.75.75 0 0 1 .75-.75Zm3.4 0a.75.75 0 0 1 .75.75v6a.75.75 0 1 1-1.5 0v-6a.75.75 0 0 1 .75-.75Z"
clip-rule="evenodd"
/>
</svg>
</button>
</td>
{% endif %}