VAPP-4: Replace router debug route dump with friendly 404 page for unmatched paths #7

Merged

David merged 1 commit from feat/not-found-page-vapp-4 into main

2026-06-06 03:04:22 +02:00

David commented

2026-06-06 01:37:42 +02:00

Owner

VAPP-4: Replace router debug route dump with friendly 404 page for unmatched paths

Any URL that matches no defined route now renders a friendly "Page not found" page inside the normal app Layout (sidebar and topbar stay visible and clickable), instead of the Dioxus router's built-in failure renderer dumping "Failed to parse route ... Attempted Matches: ..." as raw text on a black page.

Changes

Added a final catch-all NotFound { segments: Vec<String> } variant to the Route enum in src/routes.rs, declared last and under #[layout(Layout)] so it renders inside the app chrome. A one-liner NotFound wrapper component delegates to NotFoundPage, matching the existing per-route pattern.
New src/components/pages/not_found.rs with NotFoundPage(segments: Vec<String>): reconstructs the attempted path as /{segments.join("/")}, shows it in monospace, renders heading "Page not found" and body copy, and offers a Link { to: Route::Dashboard {} } styled as vc-btn. Uses the vc-card / vc-card-header idiom from settings.rs.
Registered the module in src/components/pages/mod.rs and imported NotFoundPage in src/routes.rs.
Added the matching Route::NotFound { .. } arm to topbar::title_for so the title match stays exhaustive (topbar shows "Page not found").

Verification

cargo check (default) passes.
cargo check --features server passes.
cargo check --target wasm32-unknown-unknown passes.
just build-css succeeds.

All nine existing routes are unchanged.

#VAPP-4

## VAPP-4: Replace router debug route dump with friendly 404 page for unmatched paths Any URL that matches no defined route now renders a friendly "Page not found" page inside the normal app `Layout` (sidebar and topbar stay visible and clickable), instead of the Dioxus router's built-in failure renderer dumping "Failed to parse route ... Attempted Matches: ..." as raw text on a black page. ### Changes - Added a final catch-all `NotFound { segments: Vec<String> }` variant to the `Route` enum in `src/routes.rs`, declared last and under `#[layout(Layout)]` so it renders inside the app chrome. A one-liner `NotFound` wrapper component delegates to `NotFoundPage`, matching the existing per-route pattern. - New `src/components/pages/not_found.rs` with `NotFoundPage(segments: Vec<String>)`: reconstructs the attempted path as `/{segments.join("/")}`, shows it in monospace, renders heading "Page not found" and body copy, and offers a `Link { to: Route::Dashboard {} }` styled as `vc-btn`. Uses the `vc-card` / `vc-card-header` idiom from `settings.rs`. - Registered the module in `src/components/pages/mod.rs` and imported `NotFoundPage` in `src/routes.rs`. - Added the matching `Route::NotFound { .. }` arm to `topbar::title_for` so the title match stays exhaustive (topbar shows "Page not found"). ### Verification - `cargo check` (default) passes. - `cargo check --features server` passes. - `cargo check --target wasm32-unknown-unknown` passes. - `just build-css` succeeds. All nine existing routes are unchanged. #VAPP-4

David added 1 commit

2026-06-06 01:37:42 +02:00

feat(router): friendly 404 page for unmatched paths

Check / fmt + clippy + build + tests (pull_request) Successful in 45s

Details

Create release / Create release from merged PR (pull_request) Has been skipped

Details

153a0d7fb1

Add a final catch-all `NotFound { segments: Vec<String> }` variant to the `Route` enum under `#[layout(Layout)]`, so any URL that matches no defined route renders a friendly "Page not found" page inside the normal app shell (sidebar and topbar stay visible and navigable) instead of the Dioxus router's debug route dump.

The new `NotFoundPage` (`src/components/pages/not_found.rs`) reconstructs the attempted path, shows it in monospace, and offers a "Go to Dashboard" link styled as `vc-btn`, following the existing `vc-card` page idiom. `topbar::title_for` gains a matching arm so the match stays exhaustive.

#VAPP-4