Creating Reusable Validity Checks with Branded Types and Type Helpers
This exercise has a familiar structure, with validatePassword
and createUserOnAPI
functions:
const validatePassword = (values: PasswordValues) => { if (values.password !== values.confirmPassword) { throw new Error("Passwords do not match"); } return values;};const cr
Transcript
0:00 In this exercise, we're going to use the structure of a previous exercise where we have basically a onSubmit handler. We have this create User on API and a validate password function. In this case, we've just got a password and confirm password.
0:17 In this one, it's hard to brand the password and confirm password together. What we've got is actually a reusable type helper. We have a valid here, which is basically saying, "When we create the user on the API, then these password values should be valid. They should be validated. If they're not validated, then we shouldn't allow them."
0:40 It should fail if you do not validate the values before calling create a User on API. This one is just calling create a User on API with the raw values. You can see it's expecting to error, but it's actually not erroring. On this onSubmit handler, we should be allowed to validate the values first, and then create the user on the API.
0:58 Your job is to basically find a way to type this so that it turns out to be accurate, and it implements this. Also, type this, this validate password function. Good luck