Skip to content

Tailwind #54 — Shared helpers (notifications, modals, enum)

FieldValue
GitLabsourcecontrollers/safecall#54
Parent#52
Roadmaptailwind-roadmap.md
Depends on#53 (closed)
Workflowopen

Goal

Point shared web/lib UI helpers at the Tailwind component catalog: notifications, modal open/close, visibility (hidden), and replace BulmaNotification with a framework-neutral enum whose values are catalog class names. Feature-page Bulma markup stays until later steps.

Design principles

  1. Helpers emit catalog classes (notification-success, btn, modal-backdrop) — not Bulma is-* strings as the long-term API.
  2. During coexistence, accept legacy Bulma class inputs only if needed for a soft transition; prefer mapping inside the helper so call sites can migrate gradually.
  3. Soft/solid: never invent is-light; use *-soft catalog variants.
  4. Keep data-theme rules from #53.

Acceptance criteria

  • [x] BulmaNotification renamed (e.g. UiNotification) in lib/src/types/enums.ts; consumers updated; values map to catalog classes
  • [x] Notification show/hide helpers use catalog notification classes
  • [x] Modal helpers use catalog modal/backdrop classes (Bulma aliases OK until #62 if documented)
  • [x] Visibility helper prefers .hidden; .is-hidden alias allowed until #62
  • [x] Shared class builders used across many pages updated (buttons/tags/notifications)
  • [x] Lib + web typecheck; server typecheck if lib enum export changes affect it

Implementation notes

  • Primary touch: lib/src/types/enums.ts, web/src/lib/util.ts, notification/modal call sites (~40+ files may import the enum).
  • Prefer one mapping table in the helper so pages can pass semantic names.
  • Do not rewrite full page templates here — only shared strings/helpers.

Out of scope

WorkIssue
Navbar / login / settings templates#55
User / admin page bulk markup#56#61
Remove Bulma#62

Key paths

  • lib/src/types/enums.ts
  • web/src/lib/util.ts
  • web/src/lib/version-check.ts (if it builds HTML classes)
  • Grep: BulmaNotification, is-hidden, notification, modal-background

Verification

  1. cd lib && bun run typecheck; cd web && bun run typecheck; cd server && bun run typecheck if lib used by server.
  2. Smoke: toast success/error; open/close a modal; element hide/show.
  3. Grep: no remaining BulmaNotification symbol (unless deprecated re-export removed).

Done when / handoff

  1. Operator verifies → commit with Closes #54 → push gitlab.
  2. Next: #55 shell + auth + settings.