File Validation
Loading "Typescript Integration"
Run locally for transcripts
๐ฆบ I'm not too pleased with the fact that we're just ignoring TypeScript.
Remember:
TypeScript isn't making your life worse. It's just showing you how bad
your life already is.
โ me
โ me
Currently, users could upload whatever they want to our server and we don't
validate anything at all, so it could lead to pretty broken experiences.
We've already got Zod setup in this form, we just need to add support for the
imageId, file, and altText fields.To help you with the Zod schema, you may checkout
the Conform docs on File Uploads. Here's
a snippet from that example:
const schema = z.object({
profile: z.instanceof(File, { message: 'Profile is required' }),
})
In our case, the file is optional since the user may just be updating an
existing file. But we do want to warn the user if they're going to try and
upload a file that's too large, so for our
refine call, we can just check that
the file.size isn't too big.We'll get to actually displaying errors later on.
If you're trying to submit the form and nothing is happening, it could be an
error that's preventing the form from submitting. But you'll not see the
errors until we add those. Until then, you can comment out the
onValidate
function to prevent client-side validation and check out errors in the network
tab.With that, you should be good to go on this one!