any ways to specify base url? (escaped literal sections)

[smblee]

Is it possible to achieve something like this where we escape a literal section and actually attach the literal if desired.

const ApiRoutes = createRouting({
	getProfiles: segment`${API_BASE_URL}/api/profiles`,
)};

This results in undefined/api/profiles

[konowrockis]

Hi,

unfortunately due to the fact that the default template literal string mechanism does not apply here, currently it's not possible to parametrize routes this way.

However I think there's an ugly workaround where you could derive from PathParamDescription. Then you need to override the pattern with the configured constant and make it optional. Haven't tested it but in theory it should work.

If you need I could try to implement the solution above, see if it works and share it.

The case you described should be however implemented as first class, with segment`${() => API_BASE_URL}/api/profiles` or something like this.

[kotertom]

Hi, could you elaborate a bit on your use case? I believe we haven't ever imagined managing API endpoints (I assume this is what you're trying to do) to be a feature we'd like to cover with this package. Now that you mention it, it actually looks like it's something ts-routes could be used for.

Are you trying to prefix all routes created with createRouting with API_BASE_URL so that you don't have to remember to add this prefix everywhere when calling your API? If so, for now what I can suggest is, for example, to wrap your fetching logic in a function so that it always adds the base url to the path, like so:

function fetchFromApi(path: string /*, ...otherParams */) {
  return fetch(API_BASE_URL + path /*, other params */);
}

It should also be possible to write a wrapper around the whole ts-routes package where all routes created by createRouting are prefixed with a given string. I imagine its usage could look a bit like this:

const apiRoutes = withBaseUrl(API_BASE_URL)(
  createRouting({
    getProfiles: segment`/api/profiles`,
  }),
);

// and then for example if API_BASE_URL === 'https://localhost:4000', it yields this
apiRoutes.getProfiles() // 'https://localhost:4000/api/profiles'
// while the pattern for matching the path would be left untouched
apiRoutes.getProfiles.pattern // '/api/profiles'

Would such a functionality cover your use case? It might be something to consider adding either to this package or even as some sort of an external package that builds on top of this, as I don't think ts-routes' internals would need to be changed to support that last option of a withBaseUrl wrapper. Let me know what you think

[smblee]

Hey folks thanks for getting back to this for me.

Yes indeed the usecase would be for having one place to have all the API endpoints in one place. Backend is hosted in a different domain and we don't want to add a proxy (e.g. /api alias) for unnecessary hop.

Specifically we are using SvelteKit and they have a built in way to "invalidate" (i.e. invalidate('https://.../api/my/resource') or invalidate(ApiRoutes.getThingById(123) in our case) or trigger a refetch of a given fetch resource URL.

Since we have to use full paths, we are currently using a simple object map like so

class ApiRoutes {
	static getProfiles = `${API_BASE_URL}/api/profiles`;
	static getUser = `${API_BASE_URL}/api/user`;
    static getThingById = (id) =>  `${API_BASE_URL}/api/thing/${id}`;

which obv works... but its a bit inconsistent with what we do for Application routes, where we use ts-routes.

All that said, I think the latter baseURL approach would definitely suffice!

I think the configuration could also be done this way too? not sure what the "options" object is being used for atm.

const apiRoutes =  createRouting({
    getProfiles: segment`/api/profiles`,
  }, { baseUrl: API_BASE_URL })

[dylanpomeroy]

+1 on this! We have a similar requirement where we're joining outputs of routs with a base URL. We'll manually implement a withBaseUrl in the meantime 👍

[alszczep]

Hey, we looked back on that and we'll have it done for you as soon as possible.