Deadline form: Auto-rule resolved name should be on its own row, not crammed with the Rule toggle #98

Open
opened 2026-05-25 13:20:32 +00:00 by mAi · 1 comment
Collaborator

m's report (2026-05-25 15:20)

In the deadline create/edit form (artemis's t-paliad-258 / m/paliad#89), the Rule field's Auto-mode resolved-rule name is currently rendered inline with the Rule toggle row instead of breaking to its own line:

Due date
2026-05-25
Type (optional)
Application for cost decision  ×
Search or type…  Browse all  + Add new type…
Rule
Enter custom rule  Auto                                ← toggle row
Application for Cost Decision · UPC.RoP.151            ← crammed here, same row as toggle
Source
Calculator

the auto rule part needs its own row — not be in the same row as the selection

What to do

  1. Find the Rule field's Auto-mode resolved-name rendering in frontend/src/client/deadlines-new.ts + deadlines-detail.ts (artemis's #89 territory).
  2. Move the resolved-rule display (e.g. "Application for Cost Decision · UPC.RoP.151") onto its OWN row below the toggle, full-width.
  3. Same treatment for the edit form (deadlines-detail).
  4. Visual: the resolved-name row uses the canonical rule-label component from frontend/src/client/rule-label.ts (artemis added that). Style as a read-only chip / muted text + small "Auto" prefix badge.

Files most likely touched

  • frontend/src/client/deadlines-new.ts (Rule field render)
  • frontend/src/client/deadlines-detail.ts
  • frontend/src/styles/global.css (layout / spacing for the new row)

Hard rules

  • Don't break the Custom-mode rendering (free-text input).
  • Keep the toggle compact + on its own row.
  • go build ./... && go test ./internal/... && cd frontend && bun run build clean.
  • Branch: mai/<worker>/auto-rule-own-row.

Out of scope

  • Re-styling the entire deadline form.
  • Changing the Source / Calculator fields.

Reporting

mai report completed with branch + SHAs + before/after layout description: Auto mode → resolved name on its own row below the toggle, no horizontal cramming.

## m's report (2026-05-25 15:20) In the deadline create/edit form (artemis's t-paliad-258 / m/paliad#89), the Rule field's Auto-mode resolved-rule name is currently rendered inline with the Rule toggle row instead of breaking to its own line: ``` Due date 2026-05-25 Type (optional) Application for cost decision × Search or type… Browse all + Add new type… Rule Enter custom rule Auto ← toggle row Application for Cost Decision · UPC.RoP.151 ← crammed here, same row as toggle Source Calculator ``` > the auto rule part needs its own row — not be in the same row as the selection ## What to do 1. Find the Rule field's Auto-mode resolved-name rendering in `frontend/src/client/deadlines-new.ts` + `deadlines-detail.ts` (artemis's #89 territory). 2. Move the resolved-rule display (e.g. "Application for Cost Decision · UPC.RoP.151") onto its OWN row below the toggle, full-width. 3. Same treatment for the edit form (deadlines-detail). 4. Visual: the resolved-name row uses the canonical rule-label component from `frontend/src/client/rule-label.ts` (artemis added that). Style as a read-only chip / muted text + small "Auto" prefix badge. ## Files most likely touched - `frontend/src/client/deadlines-new.ts` (Rule field render) - `frontend/src/client/deadlines-detail.ts` - `frontend/src/styles/global.css` (layout / spacing for the new row) ## Hard rules - Don't break the Custom-mode rendering (free-text input). - Keep the toggle compact + on its own row. - `go build ./... && go test ./internal/... && cd frontend && bun run build` clean. - Branch: `mai/<worker>/auto-rule-own-row`. ## Out of scope - Re-styling the entire deadline form. - Changing the Source / Calculator fields. ## Reporting `mai report completed` with branch + SHAs + before/after layout description: Auto mode → resolved name on its own row below the toggle, no horizontal cramming.
mAi self-assigned this 2026-05-25 13:20:32 +00:00
Author
Collaborator

Resolved — moved Auto-rule resolved name to its own row

Branch: mai/hermes/gitster-deadline-form
Commit: aa2f4aa

What changed

  • frontend/src/styles/global.css.rule-mode-auto promoted from display: inline-flex (content-sized pill) to display: flex; width: 100%; box-sizing: border-box; with margin-top: 0.35rem. The Auto chip now occupies its own block-level row beneath the toggle instead of sitting inline-flex visually crammed next to it.
  • frontend/src/client/deadlines-new.ts + deadlines-detail.ts — resolved-rule text now rendered via formatRuleLabelHTML(rule, esc) (the canonical rule-label component artemis added in #89 / t-paliad-258) instead of plain formatRuleLabel. The name gets primary colour, the citation gets the muted-secondary styling. formatRuleLabel is still imported for the form-title head construction further down.

Before → After

Before

Rule
[Eigene Regel eingeben]   ← toggle row (right-aligned button)
[Auto] Application for Cost Decision · UPC.RoP.151   ← inline-flex pill, visually crammed up against the toggle row

After

Rule                      [Eigene Regel eingeben]
┌─────────────────────────────────────────────────────────────┐
│ [Auto]  Application for Cost Decision · UPC.RoP.151         │
└─────────────────────────────────────────────────────────────┘

Full-width lime-tint chip on its own row with 0.35rem clearance above. Citation portion is muted (.rule-label-cite).

Out of scope, preserved

  • Custom mode (free-text input) is unchanged — the .rule-mode-custom input already filled the column width.
  • Empty-state fallback messages ("Wählen Sie zuerst eine Verfahrenshandlung" / "Keine Regel zur gewählten Verfahrenshandlung") still use textContent with the .rule-auto-text--empty italic-muted style — they don't pass through the HTML formatter (no rule, nothing to format).
  • Source / Calculator / Notes fields untouched.

Verification

  • cd frontend && bun run build
  • go build ./...
  • go test ./internal/...

Applied to both /deadlines/new and /deadlines/:id (edit mode).

## Resolved — moved Auto-rule resolved name to its own row **Branch:** `mai/hermes/gitster-deadline-form` **Commit:** [aa2f4aa](https://mgit.msbls.de/m/paliad/commit/aa2f4aacc67ed2003ed08bbc3a6fdb7ddcad9496) ### What changed - `frontend/src/styles/global.css` — `.rule-mode-auto` promoted from `display: inline-flex` (content-sized pill) to `display: flex; width: 100%; box-sizing: border-box;` with `margin-top: 0.35rem`. The Auto chip now occupies its own block-level row beneath the toggle instead of sitting inline-flex visually crammed next to it. - `frontend/src/client/deadlines-new.ts` + `deadlines-detail.ts` — resolved-rule text now rendered via `formatRuleLabelHTML(rule, esc)` (the canonical rule-label component artemis added in #89 / t-paliad-258) instead of plain `formatRuleLabel`. The name gets primary colour, the citation gets the muted-secondary styling. `formatRuleLabel` is still imported for the form-title head construction further down. ### Before → After **Before** ``` Rule [Eigene Regel eingeben] ← toggle row (right-aligned button) [Auto] Application for Cost Decision · UPC.RoP.151 ← inline-flex pill, visually crammed up against the toggle row ``` **After** ``` Rule [Eigene Regel eingeben] ┌─────────────────────────────────────────────────────────────┐ │ [Auto] Application for Cost Decision · UPC.RoP.151 │ └─────────────────────────────────────────────────────────────┘ ``` Full-width lime-tint chip on its own row with 0.35rem clearance above. Citation portion is muted (`.rule-label-cite`). ### Out of scope, preserved - Custom mode (free-text input) is unchanged — the `.rule-mode-custom` input already filled the column width. - Empty-state fallback messages ("Wählen Sie zuerst eine Verfahrenshandlung" / "Keine Regel zur gewählten Verfahrenshandlung") still use `textContent` with the `.rule-auto-text--empty` italic-muted style — they don't pass through the HTML formatter (no rule, nothing to format). - Source / Calculator / Notes fields untouched. ### Verification - `cd frontend && bun run build` ✅ - `go build ./...` ✅ - `go test ./internal/...` ✅ Applied to both `/deadlines/new` and `/deadlines/:id` (edit mode).
Sign in to join this conversation.
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: m/paliad#98
No description provided.