Routing with wildcard paths is impossible
See original GitHub issueI’ve been using this router for a week and finally ran into my first major issue that’s so far been impossible to work around. The code in master would seemingly allow a workaround, but the code deployed to NPM does not.
As a bit of back story, I am using redux-first-router
as a top-level router for my app, and everything but the first level is handled by other child apps with their own routers. I am using wildcards in my route configuration like this:
const routesMap = {
ROUTE_APP_A: {
path: '/appA(.*)',
...,
},
ROUTE_APP_B: {
path: '/appB(.*)',
...,
}
}
That configuration works fine for most cases except for when I dispatch an action which includes paths that to take the place of the wildcard. This is an example of the action I’m dispatching:
dispatch({
type: 'ROUTE_APP_A',
payload: { 0: '/subRoute' }
});
The router will run through this code in pure-utils/actionToPath.js
with each item in the payload:
var transformSegment = function transformSegment(segment, route, key) {
if (typeof segment === 'string') {
if (segment.indexOf('/') > -1) {
return segment.split('/');
}
if (route.capitalizedWords === true) {
return segment.replace(/ /g, '-').toLowerCase();
}
if (typeof route.toPath === 'function') {
return route.toPath(segment, key);
}
return segment;
} else if (typeof segment === 'number') {
return segment;
}
};
It hits the first check segment.indexOf('/') > -1
, and splits the string to an array of ['', 'subRoute']
.
Eventually, that param gets to path-to-regexp
which throws the following error:
TypeError: Expected "0" to not repeat, but received `["","subRoute"]`
The error is swallowed by redux-first-router
here and then it routes to the not-found page.
The code that is currently in master could provide a workaround since route.toPath
is called, but that’s still not a clean solution.
For reference, I’m using 0.0.16-next
which is the current “latest” tag on NPM.
Issue Analytics
- State:
- Created 5 years ago
- Comments:5 (3 by maintainers)
Thanks @faceyspacey, that worked! Now my routesMap looks like this:
And I dispatch actions like this:
Just documenting in case someone else lands on this issue in the future.
does this work (taking from tests from the upcoming version, which should still work here):
:filePath
can be a url to a file like on a github repo/foo/bar/bla
– and its named