fix(ui): de-box list page filters and center table empty states (MAPPS-388) #450

Merged
longjacksonle merged 3 commits from fix/MAPPS-388-header-box-empty-states into main 2026-07-30 17:37:51 +02:00

MAPPS-388: oversized page-header box + uncentered empty states

Refs ref-pro.png (oversized search box on Projects) and ref-log.png ("No time logged yet." left-aligned).

What changed

  • Removed the bounding Card (border + shadow + p-6) around the search / type-filter controls on Projects, Companies, and Contacts. The controls now sit directly on the page, sized to their content. The controls themselves are unchanged.
  • Centered the table empty states that were left-aligned in the first column: "No time logged yet." (Time Entries, dashboard, ticket-detail Time Logged card), "No tickets yet." (dashboard), "No timesheets awaiting approval for this scope." (Timesheet Approvals), and the Assets empty state. Table cases route through a new shared TableEmptyRow (full-width colspan + centered); the one non-table case gets text-center on its paragraph.

Scope decisions (confirmed with the reporter's stand-in)

  • Calendar was left unchanged: its only box wraps the whole calendar (toolbar + month/week/day grid), a legitimate container rather than the oversized search-controls box David described. Removing it would make the grid borderless, which was not requested.
  • Scheduling templates already use the standard border-line / divide-line tokens; no high-contrast border was present, so AC #4 is satisfied as-is with no code change.

Tests

  • New render test (components::table::tests) renders TableEmptyRow to HTML via a new host-only dioxus-ssr dev-dependency and asserts the row keeps its colspan and text-center. This is the regression guard for the empty-state centering across the time / dashboard / approvals / assets tables.
  • cargo fmt --all --check, cargo clippy --all-targets -- -D warnings, cargo check --target wasm32-unknown-unknown, and cargo test --lib (231 passed) all green on 1.94.1. dioxus-ssr is a dev-dependency only, so the wasm bundle is unaffected.

Acceptance criteria

  • Page header bounding box removed on Projects, Companies, Contacts.
  • Header height matches its content.
  • "No time logged yet." empty state is centered (plus the sibling empty states).
  • Scheduling templates use the standard border token (already compliant).
  • Regression test covering the empty-state row.
  • [n/a] Calendar box left intact by design (see scope decisions).
## MAPPS-388: oversized page-header box + uncentered empty states Refs ref-pro.png (oversized search box on Projects) and ref-log.png ("No time logged yet." left-aligned). ### What changed - Removed the bounding `Card` (border + shadow + p-6) around the search / type-filter controls on Projects, Companies, and Contacts. The controls now sit directly on the page, sized to their content. The controls themselves are unchanged. - Centered the table empty states that were left-aligned in the first column: "No time logged yet." (Time Entries, dashboard, ticket-detail Time Logged card), "No tickets yet." (dashboard), "No timesheets awaiting approval for this scope." (Timesheet Approvals), and the Assets empty state. Table cases route through a new shared `TableEmptyRow` (full-width colspan + centered); the one non-table case gets `text-center` on its paragraph. ### Scope decisions (confirmed with the reporter's stand-in) - **Calendar** was left unchanged: its only box wraps the whole calendar (toolbar + month/week/day grid), a legitimate container rather than the oversized search-controls box David described. Removing it would make the grid borderless, which was not requested. - **Scheduling templates** already use the standard `border-line` / `divide-line` tokens; no high-contrast border was present, so AC #4 is satisfied as-is with no code change. ### Tests - New render test (`components::table::tests`) renders `TableEmptyRow` to HTML via a new host-only `dioxus-ssr` dev-dependency and asserts the row keeps its `colspan` and `text-center`. This is the regression guard for the empty-state centering across the time / dashboard / approvals / assets tables. - `cargo fmt --all --check`, `cargo clippy --all-targets -- -D warnings`, `cargo check --target wasm32-unknown-unknown`, and `cargo test --lib` (231 passed) all green on 1.94.1. `dioxus-ssr` is a dev-dependency only, so the wasm bundle is unaffected. ### Acceptance criteria - [x] Page header bounding box removed on Projects, Companies, Contacts. - [x] Header height matches its content. - [x] "No time logged yet." empty state is centered (plus the sibling empty states). - [x] Scheduling templates use the standard border token (already compliant). - [x] Regression test covering the empty-state row. - [n/a] Calendar box left intact by design (see scope decisions).
Introduce a shared `TableEmptyRow` for table empty states: it spans every column (`colspan`) and centers its text, dropping into an existing `TableBody { if empty { .. } }` branch without nesting its own body the way `TableEmpty` does. Callers pass their own text treatment via `class`.

Add `dioxus-ssr` as a dev-dependency so the component can be rendered to an HTML string in a host unit test, and assert the row keeps its colspan and centering. Dev-dependencies are not built for the `wasm32-unknown-unknown` check, so the client bundle is unaffected.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01QvB249F2SV9SBe3cBKRjcS
The "No time logged yet." / "No tickets yet." / "No assets …" / "No timesheets awaiting approval …" empty states rendered as a single cell in the first column, so the message sat left-aligned under the Date/first header. Route them through the shared `TableEmptyRow` so each spans the full table width and centers. The one non-table case (the ticket detail's Time Logged card) gets `text-center` directly on its paragraph.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01QvB249F2SV9SBe3cBKRjcS
fix(ui): remove oversized filter box on Projects/Companies/Contacts (MAPPS-388)
All checks were successful
Check / fmt + clippy + tests (pull_request) Successful in 8m56s
Create release / Create release from merged PR (pull_request) Has been skipped
fc5e29eedb
The search + type-filter controls were wrapped in a `Card` (border + shadow + p-6), a box much larger than the controls it held. Drop the `Card` so the controls sit directly on the page, sized to their content, keeping the bottom margin. The controls themselves are unchanged.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01QvB249F2SV9SBe3cBKRjcS
longjacksonle deleted branch fix/MAPPS-388-header-box-empty-states 2026-07-30 17:37:51 +02:00
Sign in to join this conversation.
No reviewers
No labels
No milestone
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set

Reference
psa-systems/mokosh-apps!450
No description provided.