I'm making an Next.js web app and I use the URL Params to query some information (limit, page number, order, etc).
But I don't know what would be a good way of treating bad inputs from the user.
At the moment I use Yup to validate and sanitize the inputs before using them, but the wrong values remain in the URL.
Should I do a router.replace to the same path but just adding the right query params? or is it better to show an error indicating that the values entered are not allowed?
Imagine there's a orderBy param that only allow the values name, brand or count and the user enters in the url orderBy=year with yup I just transform the value of order by to undefined, so the field is not sent in the fetch call. But the url will be still showing https://xxxxx?orderBy=year