block / block/builder-syndicate

SPA routes return 404 on page refresh

Open
#43 0 comments 0 reactions 0 assignees View on GitHub
ex machina
Dominant language
Kotlin
Stars
6
Forks
4
PR merge metrics
No merged PRs in 30d

Description

## Problem

Refreshing the browser on any client-side route (e.g. `/app/login`, `/app/posts/123`) returns a 404:

```
Nothing found at /app.
```

The `WebTabResourceModule` in `WebAssetsModule.kt` serves static files from `classpath:/web/` at the `/app/` prefix, but has no fallback for SPA routes. When the browser requests a path like `/app/posts/123`, Misk looks for a matching static file or action, finds none, and returns a 404.

## Suggested remedy

Add a catch-all `SpaFallbackAction` mapped to `/app/{path:.*}` that serves the `index.html` from classpath resources for non-asset paths (i.e. paths without a file extension). This allows React Router to handle routing client-side while preserving the URL, so the user lands on the correct page as if they had navigated there within the SPA.

Static asset paths (containing a `.`) should still return 404 to avoid masking genuinely missing files.

### Files to change

- **New:** `src/main/kotlin/.../actions/SpaFallbackAction.kt` — catch-all action that loads `classpath:/web/index.html` and serves it with `Content-Type: text/html`
- **Edit:** `src/main/kotlin/.../WebAssetsModule.kt` — register `SpaFallbackAction` via `WebActionModule.create()`

Contributor guide

Open the contributing guide

Research direction

Start with WebAssetsModule.kt and the existing WebTabResourceModule, then review the specified new SpaFallbackAction.kt entry point. Implement the described fallback for extensionless /app/ routes while leaving asset paths to return 404. Done means refreshing routes such as /app/login and /app/posts/123 loads the SPA, while missing static assets still return 404.

Written by the indexing model from the issue text.

Assessment

Tech stack
kotlin, react
Domain
frontend, web-dev
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
55/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.