next-international: Suspense triggered when changing the locale after upgrading to 1.1.1

I’ll go ahead and close this initial issue, as the current behaviour is already much better than the previous release. I’ve published next-international@1.1.2 which includes #234 and more small fixes!

@hipdev feel free to open a new issue so we can take a more in-depth look at your specific problem.

Hi guys, just tried the last two releases:

1. next-international@1.1.1 / next-international@1.1.2-rc.1 - I always see the “fallback” of Suspense when I land to “not-found” page. It’s stuck and not resolving.
2. next-international@1.1.2-rc.2 - works as expected, I see fallback only once and then page content.

p.s the way of how you solved it looks much better.

Just published next-international@1.1.2-rc.2 that adds more caching as suggested. Navigating in the example, I’m no longer seeing any suspense fallback when refreshing, changing the locale or going backward/forward.

I’m waiting for more folks to test and confirm that it’s fixed before publishing an official release.

Yeah that’s precisely what I was mentioning, great idea!

The main reason why I have to use the I18nProviderClient is to change the locale state. I handle all translation in server components.

It seems to me that some UI libs sometimes force to put a "use client" instruction in a component, and this means that you can have to use client-side translations as well in this context. 😕

(Even if things are improving and some UI libs are becoming tailor-made for Next and its App Router over time.)

We’ve had a conversation with Dan on X (Twitter), and it doesn’t seem possible right now: https://twitter.com/dan_abramov/status/1711417357183098974

I’ve tried many many things, and none works for these 3 points mentioned above. I’m kinda running out of ideas.

If anyone wants to help, here are the steps:

• Fork/clone the repo
• pnpm i
• cd packages/international-types && pnpm build
• cd packages/next-international && pnpm build
• cd examples/next-app && pnpm dev
• Add an artificial delay to the client-side locales imports, similar to https://github.com/QuiiBz/next-international/blob/1659894ced80bcfc78db22604350df9a0c49f994/examples/next-app/locales/client.ts#L8
• Navigate to /en/client and switch to FR / EN. The goal is to never show the “Loading…” (the suspense fallback) when switching locale and when refreshing the page.

@QuiiBz ok, I put the fallback prop but it is not the expected functionality, now what it does is show that component when changing a language, but I want it to work as it was before, I don’t want to show a component that replaces the entire page, just change the language 🤔