Getting URI malformed when trying to edit record with percentage (%) symbol in.

[vforvaios]

Hi everyone,

Using react-admin (tried both 4.16.0 and 5.1.2 version).

I have a form that tries to save a form with 2 fields: name and profession using simple TextInputs.

When I pass the following data (name: 'Test' and profession: 'Surgeon%'), the backend creates a record with the following id: Test__Surgeon%

When trying to access the edit page it goes to http://localhost/......../Test__Surgeon%25 (which is the auto encoded by the react-admin) and it says "Error: URI malformed."

What exactly is the issue here?

Thanks in advance.

p.s.
I've the line that crashes in useEditController: const id = propsId ?? decodeURIComponent(routeId!);
but when I use a plain editor playground I get no error:

[fzaninotto]

I managed to reproduce the problem in this Stackblitz: https://stackblitz.com/edit/github-ifstjz (click on the first post in the list to trigger the error-.

This is probably a bug in react-admin, marking it as such.

[fzaninotto]

May be caused by a recent update in react-router (6.22), see remix-run/react-router#11199

[vforvaios]

Thank you very much for your quick response. Maybe, one solution is for the backend to not create ids based on concatenation of fields, but base64 unique ids with no special characters inside.

[fzaninotto]

yes, that's a good idea! But there still seems to be a double encoding issue on the react-admin side that we must fix.