ELFA/nextgraph
15
2
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

remote-react-microapp: fix standalone mode with SyncedRouter fallbackRouter #1

Merged
niko merged 1 commit from fix/sdk/js/remote-react-microapp-standalone-router into main 2026-10-01 20:08:37 +02:00
Conversation 1 Commits 1 Files changed 1 +5 -1
michielbdejong commented 2026-10-01 16:03:27 +02:00
Owner
Copy link

Problem

pnpm dev:standalone in sdk/js/examples/remote-react-microapp rendered a blank page. Without a NextGraph host there is no ReactComponentContext, so SyncedRouter threw on mount:

SyncedRouter initialized but no NG ComponentContext available. Use this router within an NgComponent or specify a fallbackRouter.

Fix

Pass fallbackRouter to SyncedRouter in App.tsx: "BrowserRouter" in standalone mode, null otherwise, as SyncedRouter's own docs recommend. Behaviour when the app is mounted inside a host is unchanged.

Testing

Ran pnpm dev:standalone and checked http://localhost:5100 in a browser:

  • the main page renders (heading, nav links, button)
  • "Switch Component page" navigates to /switch
  • the switch toggles from "Unchecked" to "Checked" with no new console errors

Not tested inside a NextGraph host (pnpm dev).

🤖 Generated with Claude Code

## Problem `pnpm dev:standalone` in `sdk/js/examples/remote-react-microapp` rendered a blank page. Without a NextGraph host there is no `ReactComponentContext`, so `SyncedRouter` threw on mount: > SyncedRouter initialized but no NG ComponentContext available. Use this router within an NgComponent or specify a fallbackRouter. ## Fix Pass `fallbackRouter` to `SyncedRouter` in `App.tsx`: `"BrowserRouter"` in standalone mode, `null` otherwise, as `SyncedRouter`'s own docs recommend. Behaviour when the app is mounted inside a host is unchanged. ## Testing Ran `pnpm dev:standalone` and checked http://localhost:5100 in a browser: - the main page renders (heading, nav links, button) - "Switch Component page" navigates to `/switch` - the switch toggles from "Unchecked" to "Checked" with no new console errors Not tested inside a NextGraph host (`pnpm dev`). 🤖 Generated with [Claude Code](https://claude.com/claude-code)
Without a NextGraph host there is no ComponentContext, so SyncedRouter
threw and dev:standalone rendered a blank page. Use BrowserRouter in
standalone mode only, as recommended by SyncedRouter's docs.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
niko merged commit 528bd4b7d7 into main 2026-10-01 20:08:37 +02:00
niko commented 2026-10-01 20:10:09 +02:00
Owner
Copy link

Thank you for that. Indeed, laurin, the author od SyncedRouter, had documented this issue, and it is better to just fix it for the standalone mode.

One remark: for now the shell is not usable, and I will guide you through on how to integrate your React apps/components with it once it is ready (mid October). Thank you for your patience!

Thank you for that. Indeed, laurin, the author od SyncedRouter, had documented this issue, and it is better to just fix it for the standalone mode. One remark: for now the shell is not usable, and I will guide you through on how to integrate your React apps/components with it once it is ready (mid October). Thank you for your patience!
niko deleted branch fix/sdk/js/remote-react-microapp-standalone-router 2026-10-01 20:10:14 +02:00
Sign in to join this conversation.
Reviewers
No reviewers
Labels
Clear labels
No items
No labels
Milestone
Clear milestone
No items
No milestone
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
2 participants
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
ELFA/nextgraph!1
No description provided.