Bug: loading dev card page from the user profile crashes

[nickytonline]

Going to the dev card page directly works, but if you click on the dev card button near the avatar on the user profile page, it crashes.

The user is null causing the crash.

[github-actions]

Thanks for the issue, our team will look into it as soon as possible! If you would like to work on this issue, please wait for us to decide if it's ready. The issue will be ready to work on once we remove the "needs triage" label.

To claim an issue that does not have the "needs triage" label, please leave a comment that says ".take". If you have any questions, please comment on this issue.

For full info on how to contribute, please check out our contributors guide.

[nickytonline]

This is still an issue, but it appears to only occur when running locally in dev mode. Beta and Prod are fine.

Also running npm run build;npm run start locally is all good, i.e. a prod build.

It should be sorted out still though as this make for poor DX if working on the user profile/dev card. The odd thing is this is a server-side prop so if it's set, which it does get set, it shouldn't be undefined when running client-side during hydration.

app/pages/u/[username]/card.tsx

Lines 39 to 55 in cc7f172

	const username = context?.params?.username as string | undefined;
	if (!username) {
	return {
	notFound: true,
	};
	}
	const { data: userData, error } = await fetchApiData({
	path: `users/${username}`,
	pathValidator: () => safeParse(GitHubUserNameSchema, username).success,
	});
	if (error || !userData) {
	return {
	notFound: true,
	};
	}

[Dun-sin]

@nickytonline what do you want to do with this? should this still be debugged?

[nickytonline]

It's, most likely related to React's strict mode which is on by default in Next.js. Feel free to dig into this.

[Dun-sin]

It's, most likely related to React's strict mode which is on by default in Next.js. Feel free to dig into this.

Got it💪🏽

[Bashamega]

Can I work on this?

[nickytonline]

For full info on how to contribute, please check out our contributors guide.

Please read the contributing guidelines if you'd like to work on this.

[Bashamega]

.take

[Bashamega]

For full info on how to contribute, please check out our contributors guide.

Please read the contributing guidelines if you'd like to work on this.

Thanks

[Bashamega]

Hello @nickytonline
I have tried to run it locally and go to the profile, I get this error:

Console:

Note: I have followed the steps

[nickytonline]

@Bashamega, ensure you have latest of the beta branch. I just pulled down all the latest changes and I do not get the error you get, I get the original error still.

[Bashamega]

@nickytonline on my side the profile page is not loading, so i can't click on the badge.

[nickytonline]

Please ensure that you have the latest of the beta branch and that you've followed the steps in our README to get up and running locally. It definitely works locally (with the error mentioned in the issue) and it's working in our beta and production environment, so my guess is there is something not right in your local environment.

[Bashamega]

Please ensure that you have the latest of the beta branch and that you've followed the steps in our README to get up and running locally. It definitely works locally (with the error mentioned in the issue) and it's working in our beta and production environment, so my guess is there is something not right in your local environment.

I have followed the steps in the readme.
I have ran:

npm ci
npm run dev

[nickytonline]

I'm not sure what the issue is. Can you open the project in GitHub CodeSpaces, and run the setup? I have a feeling it's something with your local environment, but I have no idea what at the moment. Even if you're on Windows, that type of error wouldn't be OS specific.

[Bashamega]

sure

[Bashamega]

Thanks @nickytonline ,
It worked, i fix the issue now

[Bashamega]

The problem is with the Link tag, the link tag doesn't make it a full reload, causing the getServerSideProps to not run. There are 2 options to fix this issue:

1. Remove the Link tag and replace with window.location.href.
2. Remove the getServerSideProps and write it in a useEffect.

[nickytonline]

Glad things work for your environment now.

We want to keep the getServerSideProps, but I'm not sure a window.location.href is the best option as this only happens in development mode. Put up a pull request and we can continue the conversation there.

[Bashamega]

The issue with getServerSideProps not working locally when using the <Link /> tag but functioning in production is a known issue that has surfaced in various Next.js deployments. This typically happens because when navigating using the <Link /> component, Next.js fetches JSON data through the _next/data endpoint to re-render the page without a full reload. If the data is missing or the fetch fails, the page props might not be populated correctly, leading to issues.

Locally, this could be caused by differences in how environments handle data prefetching and cache control, or it might relate to how Next.js manages client-side navigation. In production, server configurations and CDN setups might handle these differently, which is why it works there but not locally.

[Bashamega]

Glad things work for your environment now.

We want to keep the getServerSideProps, but I'm not sure a window.location.href is the best option as this only happens in development mode. Put up a pull request and we can continue the conversation there.

sure

[open-sauced]

🎉 This issue has been resolved in version 2.64.0-beta.2 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀

[open-sauced]

🎉 This issue has been resolved in version 2.64.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀