Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix: server router #501

Merged
merged 44 commits into from
Feb 21, 2024
Merged

fix: server router #501

merged 44 commits into from
Feb 21, 2024

Conversation

Aslemammad
Copy link
Contributor

Resolves #417

This PR adds ServerRouter and injects it for the routes in the server, so users don't hit the "Missing router error"

on Discord:

The issue is obvious, useChangeLocation and useLocation are being run in the server (as expected with --with-ssr)
And Router is only wrapped around in main.tsx so this one only runs in the client
Even if we bring it in entries or Layout, it won't work since it uses browser APIs
So the solution is to make Router compatible with being run in the server! Shall I do that?

Copy link

vercel bot commented Feb 18, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

1 Ignored Deployment
Name Status Preview Updated (UTC)
waku ⬜️ Ignored (Inspect) Visit Preview Feb 20, 2024 1:44pm

Copy link

codesandbox-ci bot commented Feb 18, 2024

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

Copy link
Sponsor Contributor

@himself65 himself65 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

update test case also?

Copy link
Owner

@dai-shi dai-shi left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good try, but it's not how it's designed. Keep trying.

@@ -239,13 +240,17 @@ export const renderHtml = async (
default: { createFromReadableStream },
},
{ ServerRoot },
{ ServerRouter },
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This is not what we want. waku/router should work without changing the core. (otherwise, other router integration like TanStack Router wouldn't be possible.)

You should change getSsrConfig in unstable_defineRouter. Let me know if you need any help.

Comment on lines 333 to 335
if (!isServer) {
throw new Error('ServerRouter is not supposed to be run in the client');
}
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We don't need this check (at least for now). But, maybe we need some comments telling it's not a public API, also for ServerRoot.

@Aslemammad
Copy link
Contributor Author

Sure, I'll resolve the comments soon!

@Aslemammad
Copy link
Contributor Author

update test case also?

Which ones?

export function ServerRouter({
children,
loc,
}: PropsWithChildren<{ loc: ReturnType<typeof parseLocation> }>) {
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Just my preference:

Suggested change
}: PropsWithChildren<{ loc: ReturnType<typeof parseLocation> }>) {
}: { children: ReactNode; loc: ReturnType<typeof parseLocation> }) {

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'll revert this since it would force us to pass children and children would force us to have keys if we pass array, unless we pass a fragment, which does not look good too.

Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It's just a TS issue, right?
I can take care of it later.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

hmm, ts issue, key issue + code formatting issue

@Aslemammad Aslemammad marked this pull request as ready for review February 20, 2024 13:44
Copy link
Owner

@dai-shi dai-shi left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM. Nice work!

Comment on lines -74 to -76
"react": "18.3.0-canary-14fd9630e-20240213",
"react-dom": "18.3.0-canary-14fd9630e-20240213",
"react-server-dom-webpack": "18.3.0-canary-14fd9630e-20240213",
Copy link
Owner

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Was this causing the CI issue?

@dai-shi dai-shi merged commit af6f50c into dai-shi:main Feb 21, 2024
28 checks passed
@Aslemammad
Copy link
Contributor Author

Aslemammad commented Feb 21, 2024 via email

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

useLocation not work Error: Missing Router
3 participants