Integrate next-safe-navigation

[zbeyens]

Hey! Thanks for solving NextJS gaps with nuqs. https://github.com/lukemorales/next-safe-navigation just landed and I do think it would be a nice pair with nuqs. At the moment, I'd need to skip using useSafeSearchParams in favor of nuqs, but it would be nice to have a unified solution.

[franky47]

There's also https://next-typesafe-url.dev

@zbeyens what would be the ideal user-facing API way in your opinion?

Some form of declarative way of describing routes (already done by Next.js + typed routes) and search params (already doable in nuqs), coupled to generated type augmentations of the <Link> and router methods would be a good start, but I feel like this is an area where "competition" could end up making DX worse in the long run.

I'd love to discuss with @lukemorales and @ethanniser on how to get to a TanStack Router-like DX for routing in Next.js.

[ethanniser]

thanks for the ping, would love to provide whatever experience I have here to collaborate and help push this space forward

---

nuqs looks really cool, basically solves this issue from my repo

I also just skimmed over next-safe-navigation and it looks pretty neat, probably some cool ideas to incorporate

I think something we do a bit differently is obviously having the user write out their routes, vs code gen'ing it. I saw the code gen as a necessary step to get people to use the package with the existing file based routing. It looks like tanstack router went the same way too for their file-based-routing mode, with some even cooler stuff as well. While it can work, I think the manual way is kind of a 'worst of both modes' senario, where you have file based routing, and then a non file based router on top.

also just looked over the tanstack router docs for the first time in a while, and they've changed a bit since I took inspiration last year, so probably even more ideas to draw from there

---

The biggest thing I always wanted for next-typesafe-url but decided was not worth doing because I 'didnt own the router' was the like setState style update function

<Link
  search={(prev) => ({ page: prev.page + 1 })}
>
  Next Page
</Link>

maybe we could figure that out together