Files
integreat/resources/templates/transaction-bulk-code/account-grid.html
Bryce ee558a34e9 refactor(ssr): compose the bulk-code form entirely in Selmer
Each bulk-code route now ends in a single sel/render call; all composition
(modal chrome, body, account grid, rows, footer, errors) happens in the
templates via {% extends %}/{% block %}/{% include %}/{% with %}, reading one
nested view-model (form-ctx). No HTML is stitched together in Clojure.

- Add components/modal-card.html: a base chrome with head/body/footer blocks;
  bulk-code/card.html extends it. (Transaction Edit keeps its string-slot
  edit-modal.html for now.)
- New top-level templates: open.html, form.html, card.html, body.html; rework
  account-grid/account-row/footer/head to pull the shared component partials in
  via {% include %}+{% with %} instead of hardcoding class strings or receiving
  pre-rendered HTML strings.
- render-form / open-handler collapse to one sel/render of form.html / open.html.
  bulk-code-body*, footer*, form-errors-html, account-grid*, the *errors* dynamic
  var and ferr are gone; field errors are read straight from :form-errors.
- Extract sc/{select,button,a-button,a-icon-button}-ctx so templates can include
  those partials with computed context (the render wrappers now call the -ctx fns).

Verified: rendered output is DOM-identical to the prior version across empty /
populated / error scenarios (whitespace-normalized token compare), plus browser
QA (open, vendor auto-populate, add/remove row, typeahead, per-row location swap,
percentage validation, submit); no JS errors.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-06-29 19:44:52 -07:00

23 lines
1.3 KiB
HTML

{# Expense-account grid -- fully template-driven. A single for-loop over the per-row
view-models (bulk-code/account-row-vm), each delegating to account-row.html. The
trailing "New account" button (a-button partial) posts the whole #bulk-code-form
(op=new-account). #}
<div class="shrink overflow-y-scroll">
<table class="w-full text-sm text-left text-gray-500 dark:text-gray-400 shrink">
<thead class="text-xs text-gray-800 uppercase bg-gray-50 dark:bg-gray-700 dark:text-gray-400 group-[.raw]:sticky group-[.raw]:z-10 group-[.raw]:top-0">
<tr>
<th class="px-4 py-3" scope="col">Account</th>
<th class="px-4 py-3 w-32" scope="col">Location</th>
<th class="px-4 py-3 w-16" scope="col">%</th>
<th class="px-4 py-3 w-16" scope="col"></th>
</tr>
</thead>
<tbody>
{% for row in accounts.rows %}{% include "templates/transaction-bulk-code/account-row.html" %}{% endfor %}
<tr class="new-row border-b dark:border-gray-600 group hover:bg-gray-100 dark:hover:bg-gray-700">
<td class="px-4 py-2" colspan="4">{% with classes=accounts.new_account.classes attrs=accounts.new_account.attrs indicator=accounts.new_account.indicator body=accounts.new_account.body %}{% include "templates/components/a-button.html" %}{% endwith %}</td>
</tr>
</tbody>
</table>
</div>