Archived
austinandClaude Opus 5
54710019d2
build-and-publish / build (pull_request) Successful in 2m0s
The last React went with this. /admin and /admin/catering are pages of forms; every write is a POST and a redirect back, so the back button and reload do what they look like they do, a double-tap cannot repeat an upload, and there is no client-side state to lose — a reload is always the truth. The /api/admin/** endpoints went too: they existed for the React screen, and their logic now lives in Catalogue (extracted from the two deleted JSON controllers) and CateringMenu, which the pages call. THE TABLE EDITOR IS THE INTERESTING PART, because a catering table cannot be edited a field at a time — a column heading, its price and the entries beneath it only mean anything together. One form holds the whole table and every button submits it; `name="do"` says which was pressed and its value carries the position (`remove-column:2`). "Add a column" therefore arrives with every cell the editor has typed, adds the column to what arrived plus an empty entry on every line, and re-renders. Nothing typed is lost, and only Save writes — so a half-built table with a blank heading never reaches the live page. A failed save comes back the same way, with the work still in the form and the reason above it; a redirect would throw the work away and leave them guessing which cell the message was about. Spring binds `lines[2].values[1]` into the right cell, which flat repeated parameters could not promise. Reordering moved to the server, where it always belonged: the browser used to compute the new order and send the whole list back, and now "move this up" arrives as an action. Same for arranging photos — one endpoint takes the key and -1/1/0 (earlier, later, remove), because those three buttons are the same edit. frontend/ became styles/: node, Tailwind and nothing else. It exists because Tailwind needs a compiler and the alternative is a hand-written stylesheet; there is no bundler and no framework. The admin's controls are @utility classes (v4 will only let you @apply a registered utility, and only a utility can take the `file:` variant the photo pickers use) — the same buttons the React screen had, from the same class strings it composed. Also fixed .gitignore, which still named frontend/: with styles/ unlisted, `git add -A` staged 1,626 files of node_modules. Verified against a running container, not only in tests: pressing "+ Column" returns the draft with an unsaved cell intact, a new column and a matching new entry on the line, "Not saved yet" — and the live page unchanged; Save then writes both columns with the price parsed from "48". Renaming and moving an item land on the products page. Deleting a category that is in use is refused with the sentence naming it. Removing the only photo of an item is refused, and that button is already disabled in the page. 51 tests (10 new): the form binding, the flash on success and on refusal, a structural button writing nothing, and the whole admin surface closed to anonymous visitors. PlatformContractTest's routing assertion now says what is true — an unknown path 404s, and so does /admin when no identity provider is configured, because AdminController only exists under OIDC. Co-Authored-By: Claude Opus 5 (1M context) <[email protected]>
51 lines
1.9 KiB
CSS
51 lines
1.9 KiB
CSS
/*
|
|
* The admin's controls.
|
|
*
|
|
* Component classes rather than utility strings repeated through the markup, because the admin is made
|
|
* of forms: there are dozens of buttons on a page and each one is its own <form>. The public pages keep
|
|
* their utilities inline — they each look different — but "a button in the admin" should be one decision
|
|
* in one place. These are the same buttons the React screen had, from the same class strings it composed.
|
|
*
|
|
* @utility, not `.btn { @apply … }` in a components layer: Tailwind v4 will only let you @apply a class
|
|
* it knows as a utility, and only a registered utility can take a variant — which `file:btn-secondary`
|
|
* on the photo pickers needs.
|
|
*/
|
|
@utility btn {
|
|
@apply inline-flex items-center justify-center gap-1.5 rounded-md px-3 py-1.5 text-sm font-medium
|
|
transition-colors;
|
|
}
|
|
|
|
@utility btn-primary {
|
|
@apply btn bg-bakery-600 text-white hover:bg-bakery-700
|
|
disabled:opacity-40 disabled:cursor-not-allowed;
|
|
}
|
|
|
|
@utility btn-secondary {
|
|
@apply btn border border-bakery-300 text-bakery-800 hover:bg-bakery-100
|
|
disabled:opacity-40 disabled:cursor-not-allowed;
|
|
}
|
|
|
|
@utility btn-danger {
|
|
@apply btn text-red-700 hover:bg-red-50 disabled:opacity-40 disabled:cursor-not-allowed;
|
|
}
|
|
|
|
/* Square, for the arrows and the crosses — a row of these is how anything gets reordered. */
|
|
@utility btn-icon {
|
|
@apply inline-flex items-center justify-center w-7 h-7 rounded-md border border-bakery-300
|
|
text-bakery-700 hover:bg-bakery-100 transition-colors
|
|
disabled:opacity-30 disabled:cursor-not-allowed;
|
|
}
|
|
|
|
@utility field {
|
|
@apply w-full rounded-md border border-bakery-300 bg-white px-3 py-2 text-sm
|
|
focus:border-bakery-500 focus:outline-none focus:ring-1 focus:ring-bakery-500;
|
|
}
|
|
|
|
@utility card {
|
|
@apply rounded-lg border border-bakery-200 bg-white p-4 shadow-sm;
|
|
}
|
|
|
|
@utility card-heading {
|
|
@apply font-adbhashitha text-xl text-bakery-800;
|
|
}
|