Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Infer required params from path template #138

Open
mdarens opened this issue Feb 25, 2021 · 2 comments · May be fixed by #259
Open

Infer required params from path template #138

mdarens opened this issue Feb 25, 2021 · 2 comments · May be fixed by #259
Labels
enhancement New feature or request

Comments

@mdarens
Copy link

mdarens commented Feb 25, 2021

Is your feature request related to a problem? Please describe.

When param keys are defined in the path template, there is no static validation that they are present in the params object, which can lead to unbound path template components at runtime. The most likely case in which this occurs tends to be a casing or spelling mismatch on a path template component or params property.

Describe the solution you'd like

With the advent of template literal types in TypeScript 4.1, we can check for keys defined in the path argument and make them required in params. I've stubbed out a naïve annotation, which doesn't cover all the implemented overloads, as a proof of concept.:

type PathTemplateTokens<Rte> = Rte extends `${string}/:${infer P}/${infer Rest}`
  ? P | PathTemplateTokens<`/${Rest}`>
  : Rte extends `${string}/:${infer P}`
  ? P
  : never;

function urlcat<BaseUrl extends string,
  PathTemplate extends string,
  Params extends Record<PathTemplateTokens<PathTemplate>, string | number>
>(
  baseUrl: BaseUrl,
  pathTemplate: PathTemplate,
  params: Params) { };

urlcat("http://example.com", "org/:orgName/user/:userId", {
  foo: "bar"
}); // error! required properties missing
urlcat("http://example.com", "org/:orgName/user/:userId", {
  orgname: "SprocketCo",
  userId: "951d20a0-e188-4db4-a946-df426d3d9e91"
}); // error! suggests `orgName` when spelled `orgname`
urlcat("http://example.com", "org/:orgName/user/:userId", {
  orgName: "SprocketCo",
  userId: "951d20a0-e188-4db4-a946-df426d3d9e91"
}); // ok, everything required is there
urlcat("http://example.com", "org/:orgName/user/:userId", {
  orgName: "SprocketCo",
  userId: "951d20a0-e188-4db4-a946-df426d3d9e91",
  sortBy: "sprocketsPerWeek"
}); // ok, extra stuff goes in the query string

Describe alternatives you've considered

N/A

Additional context
Add any other context or screenshots about the feature request here.
TypeScript Playground link to stub implementation

Screenshot of TypeScript suggesting params:
image

Screenshot of TypeScript catching a spelling mistake:
image

Thanks so much for your time! I love this library.

@mdarens
Copy link
Author

mdarens commented Feb 25, 2021

I went ahead and added the overloads. see this gist

@balazsbotond
Copy link
Owner

Wow, this is amazing. If you are still interested in this feature, please make a PR.

@balazsbotond balazsbotond added the enhancement New feature or request label Dec 5, 2022
@jrel jrel linked a pull request May 22, 2023 that will close this issue
jrel added a commit to jrel/urlcat that referenced this issue May 22, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants