Inconsistent decoding/encoding of params between server and client

I have a link that contains a param that needs to be url-encoded, constructed using

<Link route="foo" params={{ bar: 'some / value' }}>
  <a>Foo</a>
</Link>

The <a> tag constructed as a result of this looks something like <a href="/foo/some%20%2F%20value">Foo</a>, which is what I would expect (params being encoded before injected in the url). If I go to this url through server-side rendering (e.g. command-click to open in a new tab), query.bar is the encoded string, "some%20%2F%20value". If I click this link to cause a client-side page load, query.bar is no longer encoded, "some / value".

I think the bug here is that the server-side should decode params before passing them down to query. That would make the behavior consistent with how next.js passes down regular query params as well (on the form ?foo=some%20value).

[jly36963]

I am having the same issue:

onClick={() => Router.push(`/programs/?program=${encodeURIComponent(fetchedProgram.name)}`)}

onClick={() => Router.push({ pathname: '/programs/', query: { program: fetchedProgram.name }})}

The URI is not encoded following the client-side transition.

I get “Program 1” instead of “Program%201” in the URI.

[LefanTan]

Same here