management-ui: migrate HashRouter to BrowserRouter - #359
Open
mrFlick72 wants to merge 6 commits into
Open
Conversation
Falls back to index.html for any unmatched path under /secure/admin instead of 404ing. No-op under the current HashRouter, but required before deep links / refreshes work once the router moves to BrowserRouter (#357). Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_019KZoBG7SfG9ZXu5T4y34Qm
Set basename="/secure/admin" (the app isn't served at domain root) and add a catch-all route redirecting to home, since the nginx SPA fallback (previous commit) now serves index.html for any unmatched path. Verified manually against the local docker-compose stack: clean URLs, hard refresh on a deep route, browser back/forward, and the full login -> callback -> returnTo redirect flow all land on the correct route. Legacy hash-style bookmarks intentionally land on home instead of the old target (BrowserRouter ignores the fragment) - acceptable for this internal admin tool. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_019KZoBG7SfG9ZXu5T4y34Qm
The hamburger icon in AdminTemplate.tsx was wrapped in <a href="#">, a HashRouter-era "go home" trick (an empty hash resolved to path "/"). Under BrowserRouter that's a no-op fragment link, so the button did nothing. Replaced it with react-router's <Link to="/">, matching the pattern already used in MenuCard.tsx. Also update management-ui/AGENTS.md, which still documented HashRouter as the current routing style and instructed future agents to preserve it - now describes BrowserRouter + the /secure/admin basename, and calls out that internal navigation must go through Link/useNavigate rather than raw <a href> tags. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01S2ymDVQMGTkRWSh5NHZrWV
webpack's HtmlWebpackPlugin bakes a relative script src into
secure/admin/index.html, computed once at build time for that file's
own nesting depth (e.g. src="../../admin.js"). Since nginx's SPA
fallback serves that same physical file for every URL under
/secure/admin/*, the relative path only resolves correctly when the
browser URL has exactly the same depth as the build output.
Routes with more path segments than the build depth - all of
/client-applications/list, /client-applications/save,
/client-applications/edit/:id, /accounts/edit/:email - resolved the
script to a wrong nested URL. nginx's fallback then serves
index.html for that request too, so the browser tries to execute
HTML as JS ("Unexpected token '<'") and the app never mounts: a
blank page on refresh. Only single-segment routes (/roles, /accounts,
/keys, /email-templates) happened to work, which is why the issue's
own example (/secure/admin/accounts) didn't catch it.
Set output.publicPath to an absolute "/" so every emitted script tag
is root-relative regardless of which URL served the HTML. Verified
via a headless-browser hard load of
/secure/admin/client-applications/edit/abc123 against a build with
and without the fix.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01S2ymDVQMGTkRWSh5NHZrWV
Home was routed at basename root ("/", i.e. /secure/admin), but the
established convention documented in auth-server/local/readme.md is
.../secure/admin/index. Route the home page at /index instead, point
the hamburger menu link and the catch-all redirect at it, and let
bare /secure/admin fall through the catch-all to /index so both still
resolve to the same page.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01S2ymDVQMGTkRWSh5NHZrWV
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
HashRouter→BrowserRouterinsrc/admin/index.tsx, withbasename="/secure/admin"and a catch-all redirect routedocker/default.conf.templatefor BrowserRouter deep linksCloses #325
Test plan
/secure/admin/roles, not/secure/admin/#/roles)returnTorestoration) lands back on the originating deep route/secure/admin/*redirects to homelocal/docker-compose.yml