How to handle route specificity issues when incrementally adopting framework routing?

[vinibanaco]

I'm experimenting the process of incrementally adopting the framework features in a simple app. I followed the guide available in the docs and everything worked out as intended, so now I'm starting to migrate some routes to the new format.

export default [
  route("/todos/:id", "./pages/todos-details.tsx"), // migrated route
  route("*?", "catchall.tsx"), // catchall.tsx contains the non-migrated routes
] satisfies RouteConfig;

However, I found an issue when migrating a parameterized route to the new format. If there's another route in the catchall that also matches the parameterized route and would normally have higher specificity (like how /todos/new is more specific than /todos/:id), the actual creation page gets unreachable. The details page will be rendered instead.

Any ideas on how do I migrate the details page without needing to migrate the creation page first?

I've already tried creating a new route() that also renders catchall.tsx, but it doesn't work because the path needs to have a trailing "*", meaning the <Routes> inside catchall.tsx receives a relative pathname (it receives "/new" instead of "/todos/new").

[sergiodxa]

Migrate highly specific routes first

Also you can define those highly specific routes and send them to the non migrated file

[vinibanaco]

That's unfortunate. It's such a common behavior and usually creation routes have forms, therefore, the largest amount of rules. But I get it, it's not too bad.

What do you mean by defining the routes and sending to the non migrated file? If you mean defining it in the framework router and pointing to catchall.tsx that's what I meant in my last paragraph.