Url reverse + compose

[dkzlv]

trafficstars

Is your feature request related to a problem? Please describe. We all need to build links between pages. Currently we have to hardcode the links right into the component or into a separate module, which can break over time.

Describe the solution you'd like The idea is not new, many backend frameworks have this implemented a long time ago: RoR, Django.

They have url configs, where they map paths with parameters to controllers. You can assign a name to this route, like post-edit or post-view. Then if you want to build a link to this route you can then call a special function, where you put this developer-friendly name and get a link in return.

It has multiple great parts:

1. the developer-friendly name is a constant, so even if you move your routes around, you won't need to change all the places that link to this route;
2. if however the constant name changes this function can throw an error so you don't miss the bad link. It can also do the same if you don't pass the needed parameters;
3. it can simplify the link-building process for a developer

The first part of the implementation should be defining the route name. Since Sapper has no url configuration file, I think it should reside in route components. It would be convenient enough to introduce something like <sapper:option routeName='blahblah'> or some export const routeName. The second part would be a function, like urlReverse, that can be imported from @sapper/app with this signature: (routeName: string, urlParams?: any) => Readable<string>. It would merge the given urlParams with current ones, so if you want to edit the currently viewed post you'd just type urlReverse('post-edit') without any params.

Describe alternatives you've considered I have a separate routes.ts file, where I maintain a bunch of derived stores, where I manually compose the routes. I then import this stuff where I need and use it there. If I need a deep-nested link, I derive a store from a derived store. This overcomplication comes from the fact that you cannot access page store outside of components, so in order to get current state of affairs you'd need to either pass $page value each time you need to build a link or just maintain current values yourself.

It works! But it is hard to maintain, it becomes a helluva mess after you have more than 20 endpoints (which is not that much!).

How important is this feature to you? Not really. I've solved it for myself, even though I've broken my links a couple of times already. But I think the community will love it.

[antony]

I've also used something like this in Rails and later Grails, and it can be handy if implemented properly. However it's one of those things where the simplicity of just being able to build strings is favourable to the largest subsection of users.

update: I missed the section on having a special tag for defining routes. This would have to become a svelte tag (since sapper isn't pitched for further development, and Sapper has no tags). I'm not 100% sure how this would work since Svelte doesn't have a router per-se. There's also server routes to consider.

[kkarpeev]

Thanks! Thought of it a long time ago. I DEFINITELY need this.